Can I use Hartwell for a client site?

Yes. A Pro seat covers unlimited personal and commercial projects, client work included.

Is Hartwell a Next.js template?

It is a React 19 page that works in Next.js (App Router or Pages Router), Vite, Remix and Astro. Drop it into a route and it renders.

Hartwell: Photographer template

Let the pictures do the talking.

For photographers: a cinematic film-still hero, a contact-sheet filmstrip, a filterable masonry portfolio, press quotes, a contact form and a studio footer with local time.

About the Hartwell template

Hartwell lets the pictures talk. A cinematic film-still hero, a 35mm contact-sheet filmstrip, a filterable masonry portfolio, press quotes, a commissions form and a studio footer with local time make a calm, image-first site.

Let the pictures do the talking. It is a complete photographer landing page for React and Tailwind CSS 4, assembled from 7 Charcoal UI sections.

Who Hartwell is for

Landscape and travel photographers.
Wedding and portrait photographers.
Fine art print sellers.
Photo agencies.

What is inside

7 sections, top to bottom:

Navbar Floating: A glass pill that hides on scroll down, with a gliding hover highlight and a mobile sheet.
Hero Film: Cinematic hero with slow Ken Burns stills, film grain, a play control and chapter markers.
Gallery Filmstrip: A strip of 35mm film with sprocket holes and frame numbers, plus a large view of the chosen frame.
Gallery Masonry: Photo gallery with tag filters over a masonry grid and a dialog for the full-size image.
Press Quotes: As-seen-in strip where outlet wordmarks act as tabs for a large rotating serif quote.
Contact Form: Contact form with topic pills, inline validation and a success state, beside your details.
Footer Contact: Studio footer with a giant email link, address, hours, live local time and a huge faded wordmark.

How it is built

Galleries take your own image URLs and captions. Every section is a separate Charcoal UI section, so you can reorder, remove or restyle any of them, and the accent colour is one CSS variable on the page wrapper.

Install Hartwell

npx shadcn@latest add @charcoal/hartwell

Templates are part of Charcoal UI Pro. One seat covers all 100 templates, 107 sections and 300 Pro components. The command installs the page and every section and component it uses, so it runs the moment it lands.

Frequently asked questions

Can I use Hartwell for a client site?: Yes. A Pro seat covers unlimited personal and commercial projects, client work included.
Is Hartwell a Next.js template?: It is a React 19 page that works in Next.js (App Router or Pages Router), Vite, Remix and Astro. Drop it into a route and it renders.

Sections in this template

Navbar Floating: A glass pill that hides on scroll down, with a gliding hover highlight and a mobile sheet.
Hero Film: Cinematic hero with slow Ken Burns stills, film grain, a play control and chapter markers.
Gallery Filmstrip: A strip of 35mm film with sprocket holes and frame numbers, plus a large view of the chosen frame.
Gallery Masonry: Photo gallery with tag filters over a masonry grid and a dialog for the full-size image.
Press Quotes: As-seen-in strip where outlet wordmarks act as tabs for a large rotating serif quote.
Contact Form: Contact form with topic pills, inline validation and a success state, beside your details.
Footer Contact: Studio footer with a giant email link, address, hours, live local time and a huge faded wordmark.

Hartwell as Markdown