Cutroom: Video editing studio landing page template for Next.js.
- Next.js 15
- Tailwind CSS v4
- TypeScript
- 11 sections
- Light
- No API keys
- Updated Oct 7, 2026
Overview
A landing page for video editing studios and creator agencies, dressed like the cutting room: a timeline hero with a playhead, a retention chart, an edit decision list for the process and a pricing calculator.
- Made for
- Video editing studios, YouTube editors, Creator agencies
- Highlights
- Editor-style hero with timeline and playhead
- Retention chart with numbered markers
- Pricing calculator with volume discounts
- One config file and one colour palette
- The look
- Clean white, near-black ink and one signal orange. The look borrows from the cutting room: timecodes, a ruler, a timeline, and key words that sit inside an orange “clip” with trim handles. There are no shadows: depth comes from borders, tints and contrast.
Sections
- 01
Hero
Headline with a clipped keyword above an editor with a timeline and playhead.
- 02
Client channels
The channels you edit for.
- 03
Services
A selector with a drawing for each video format.
- 04
Results
A retention chart with numbered markers.
- 05
Process
Your workflow written as an edit decision list.
- 06
Pricing
A calculator with volume discounts.
- 07
Testimonials
Quotes set as pinned comments.
- 08
FAQ
Common questions, answered in place.
- 09
Journal
Recent articles from your blog.
- 10
Closing block
A call to action with a footage drop zone.
- 11
Footer
Links, legal and the 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 |
|---|---|
| All copy, links, prices, chart data, FAQ | site.config.ts |
| Colours | app/globals.css (@theme) |
| Fonts | app/layout.tsx |
| Which sections appear, and in what order | app/page.tsx |
| The editor drawing in the hero | components/sections/HeroEditor.tsx |
| The service drawings | components/sections/ServiceVisuals.tsx |
Run it
$ npm install$ npm run devNode.js 18.18 or newer. No environment variables.
Before you go live
The brand, customers, numbers and quotes in the demo are placeholders. Replace them in site.config.ts, and point the buttons at your own sign-up or booking link.
Specifications
- Framework
- Next.js 15 (App Router), React 19
- Language
- TypeScript
- Styling
- Tailwind CSS v4 with design tokens and component styles
- Fonts
- Bricolage Grotesque, Hanken Grotesk, JetBrains Mono, self-hosted with next/font
- Dependencies
- next, react, react-dom, lucide-react, clsx, tailwind-merge
- Images
- None. Every visual is built in code.
- API keys and environment variables
- None
- Node.js
- 18.18 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
- 23 source files, about 2,000 lines
- Last updated
- Oct 7, 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 Cutroom?
The complete Cutroom 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 Cutroom 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?
The brand, customers, numbers and quotes in the demo are placeholders. Replace them in site.config.ts, and point the buttons at your own sign-up or booking link.
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 Cutroom are free. When a new version ships, download it again from the link in your order email.
Can I get a refund?
Yes. If Cutroom 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 Cutroom and every template added later. Three single templates would cost $117.
All-access
All 17 templates for $99.
Every template in the library, including Cutroom, and every one added later. Same license, free updates. Less than three single templates.

















