Golden Flash is a premium, production-ready template for photography studios, wedding and portrait photographers, product and editorial shooters, videographers, and small creative agencies. Built on Next.js 16, React 19, and TypeScript, it ships with 17 page templates covering 33 prerendered routes, five portfolio case studies with a keyboard-accessible lightbox, three bookable packages with a working cart and checkout, a nine-article blog with category filtering, and a fully editable content layer — no CMS or backend required.

A photographer is hired on the strength of about twelve pictures and how quickly a visitor can find the price. Golden Flash is styled with a hand-crafted CSS design system (no utility-framework lock-in) in a smoky-black and gold palette, with BDO Grotesk headlines set against Inter and motion applied with restraint — so every page keeps attention on the photographs rather than on the interface. Content lives in JSON or MDX files, so you can launch in hours.

Live demo: https://goldenflash-nextjs.vercel.app

Tech Stack

Next.js 16 — App Router, server components, all 33 routes prerendered to static HTML
React 19 — latest features; interactivity isolated to one script layer plus the cart
TypeScript — strict mode, fully typed
MDX content — articles, projects and packages as .mdx files (frontmatter parsed with gray-matter), served by [slug] dynamic routes
Hand-crafted CSS design system — colors, type scale, and spacing as CSS custom-property tokens in one :root block; re-theme everything in one place
Self-hosted fonts — BDO Grotesk and Inter served locally, no third-party font CDN
No animation library — 165 scroll reveals, the nine-image hero scatter, two scroll-scrubbed sections, five endless belts, slot-machine counters, the follow-cursor, the navigation overlay, the FAQ accordions, the category tabs and the project lightbox in one TypeScript file, no GSAP and no jQuery
Client-side storefront — cart and order state in localStorage, no database, no vendor SDK

Included Pages and Templates

Home — a scroll-driven story: the nine-image hero mosaic that scatters in on load, the studio introduction, the feature belt, the portfolio mosaic, an FAQ, the services list, the scroll-scrubbed process sequence, the three pricing packages, the testimonial belt, and a discovery-call panel
About — the studio story, the client logo belt, the reasons to book, the foundations, the strategy panel, the team, and the awards row
Portfolio — a sticky scroll-linked stack of five projects with a follow-cursor
Project — 5 case study pages with the client, year and type, a full-bleed banner, Introduction, Challenges and Solutions panels, a two-image lightbox gallery, and a related-projects strip
Blog — a directory with five category tabs over nine articles, plus 9 article pages with a hero, author block, pull quotes, full-width figures and a related strip
Pricing — three package cards with the full feature comparison table, plus an FAQ
Package — 3 detail pages with the included list, the notes, add-to-cart, and an FAQ
Storefront — a cart drawer in the navigation bar, checkout, a PayPal checkout variant, and an order confirmation page
Contact — enquiry form, studio details and an FAQ
Utility — Style Guide, Changelog, License, 401 (password), 404

17 page templates, 33 prerendered routes.

Easy Content Editing

No CMS needed — content lives in editable files you can change in any text editor:

Articles — src/content/blog/*.mdx. Frontmatter carries the title, standfirst, date, reading time, category, author and the banner and thumbnail images.
Projects — src/content/portfolio/*.mdx. Frontmatter carries the client, the year, the project type, the four photographs the page prints and the two-image gallery. The body holds the Introduction, Challenges and Solutions copy.
Packages — src/content/packages/*.mdx. Frontmatter carries the package name, the price, the included list and the id the basket stores the item under. The body holds the closing notes.
Writing a body — plain prose, not markdown: paragraphs, ## headings, > pull quotes, - list items and full-width figures. The page component puts each one inside the design's own markup, so the words are yours and the layout stays exactly as designed. No special syntax to learn.
Listing order — src/content/collections.json records what a per-item file cannot state: which articles the blog directory lists under each of its five category tabs, the order the related strips draw from, the order the portfolio stacks its projects in, which project sits in which slot of the home mosaic, and the arrangement of the home pricing row.
Theme — brand colors, fonts, type scale, and spacing are CSS custom properties at the top of public/assets/css/styles.css — change them once to re-skin the whole site.
Navigation, footer and cards — shared components edited once in src/components/.

Performance and SEO

Static-rendered pages out of the box (App Router) — all 33 routes prerendered, including every article, project and package page
Lazy-loaded imagery throughout, WebP artwork with responsive srcsets
Self-hosted fonts — no third-party CDN requests at runtime
Per-page titles and metadata via the Next.js Metadata API (generateMetadata on dynamic routes), with Open Graph and Twitter cards
Semantic HTML structure, a single H1 per page, a route-aware active navigation state, and clean, crawlable URLs
Keyboard-navigable tabs, menus and disclosures, a lightbox that takes focus and closes on Escape, and every animation respects the reduced motion setting

Deployment

One-click deploy to Vercel — build settings are auto-detected. Also runs on Netlify, AWS Amplify, Cloudflare Pages, or any Node 20+ host.

What You Get

Full Next.js 16 + TypeScript source code
17 page templates covering 33 prerendered routes
Content collections: 9 articles, 5 projects and 3 packages as MDX, plus the listing order as JSON
A working cart and checkout flow, ready to point at your payment provider
Self-contained HTML documentation
Comprehensive README with setup and editing guide
Friendly buyer support

Requirements

Node.js 20 or higher
Basic familiarity with the command line
A text editor (VS Code recommended)

Golden Flash - Next.js 16 Photography and Creative Studio Template