Stillform: Product photography studio landing page template for Next.js.
- Next.js 15
- Tailwind CSS v4
- TypeScript
- 10 sections
- Light
- No API keys
- Updated Oct 8, 2026
Overview
An editorial landing page for product photographers and CGI studios, with original campaign imagery, a filterable portfolio with project dialogs, and a shoot planner that turns an estimate into a shareable project brief.
- Made for
- Product photographers, CGI studios, E-commerce creative studios
- Highlights
- Original campaign imagery and project lightboxes
- Keyboard-operable campaign and packshot selector
- Shoot planner with products, formats and extras
- Shareable enquiry brief with your selected estimate
- The look
- A soft stone background, Instrument Serif headlines and one warm orange, with four original product studies (a fragrance, a skincare set and a pair of headphones) as the imagery.
Sections
- 01
Hero
Campaign headline, a featured study and industry specialties.
- 02
Selected work
A filterable portfolio with native project dialogs.
- 03
Studio
Manifesto and working principles.
- 04
Perspectives
A campaign, packshot and detail selector.
- 05
Services
Each service selects the matching shoot format.
- 06
Process
Four production steps with concrete deliverables.
- 07
Shoot planner
Product count, direction and extras, with a live estimate.
- 08
FAQ
Native disclosures for each question.
- 09
Project brief
A form with a review step that turns into an email draft, a copy or a text file.
- 10
Footer
An oversized studio wordmark.
Remove a section by deleting its line in app/page.tsx, or move the line to reorder.
Built with
Its motion comes from free components in our library, shipped in components/hairline/ so you can use them anywhere else on the page too.
Make it yours
Every word, link and price lives in site.config.ts. TypeScript flags a missing or misspelled field, so you can’t quietly break a section.
| To change | Edit |
|---|---|
| Brand, contact email, copy, projects, prices, FAQ | site.config.ts |
| Palette, spacing, typography | styles/base.css and app/globals.css |
| Fonts and metadata | app/layout.tsx |
| Section order | app/page.tsx |
| Product images | public/images/ |
| Quote calculation | lib/quote.ts |
Run it
$ npm install$ npm run devNode.js 20.9 or newer. No environment variables.
Before you go live
Change brand.email in site.config.ts before accepting enquiries. The brief form prepares an email draft, a copy or a text file in the browser; to send it to a form provider instead, replace the submit handler in components/sections/Contact.tsx. The brands, rates and projects are fictional demo content.
Specifications
- Framework
- Next.js 15 (App Router), React 19
- Language
- TypeScript
- Styling
- Tailwind CSS v4 with design tokens and component styles
- Fonts
- Instrument Sans, Instrument Serif, Geist Mono, self-hosted with next/font
- Dependencies
- next, react, react-dom, lucide-react
- Images
- Four original WebP product studies, included as demo imagery to replace with your own work.
- API keys and environment variables
- None
- Node.js
- 20.9 or newer
- Colour scheme
- Light
- Responsive
- Desktop, tablet and phone
- Accessibility
- Skip link, visible focus, keyboard navigation, reduced motion
- Deploys to
- Vercel, Netlify, Cloudflare Pages or any Node host
- Codebase
- 36 source files, about 3,800 lines
- Last updated
- Oct 8, 2026
License
One license, no tiers. The full text ships as LICENSE.md in the download.
You can
- Use it for your own products
- Use it for any number of client projects
- Change the code and design however you like
- Deploy the result commercially
You can’t
- Resell or share the files as a template, theme or UI kit
- Publish the source as a template in a public repository
Questions
What do I get when I buy Stillform?
The complete Stillform project as a download: the Next.js app, its config file, a README with setup and customisation notes, and the license. The download link arrives right after checkout.
Can I use Stillform for client projects?
Yes. One purchase covers your own products and any number of client projects, and you can change the code however you like. What you can’t do is resell or share the template files themselves as a template or UI kit.
Do I need API keys, a database or a backend?
No. It runs with npm install and npm run dev and deploys to Vercel, Netlify or Cloudflare Pages without any environment variables.
What should I change before I launch?
Change brand.email in site.config.ts before accepting enquiries. The brief form prepares an email draft, a copy or a text file in the browser; to send it to a form provider instead, replace the submit handler in components/sections/Contact.tsx. The brands, rates and projects are fictional demo content.
Do I need to know Next.js?
Basic React helps, but most changes are text edits in site.config.ts. The README walks through colours, fonts and section order.
How do updates work?
Updates to Stillform are free. When a new version ships, download it again from the link in your order email.
Can I get a refund?
Yes. If Stillform isn’t right for you, reply to your receipt within 14 days and you get your money back.
Should I buy all-access instead?
If you’ll use more than two templates, yes. All-access is $99 for all 17 templates, including Stillform and every template added later. Three single templates would cost $117.
All-access
All 17 templates for $99.
Every template in the library, including Stillform, and every one added later. Same license, free updates. Less than three single templates.

















