Fourteen: Done-for-you service landing page template for Next.js.

$39one-time payment

Buy FourteenLive demo

Checkout opens soon.

Next.js 15
Tailwind CSS v4
TypeScript
10 sections
Light
No API keys
Updated Oct 7, 2026

Live demo

The Fourteen landing page template on desktop, from the hero to the footer

Overview

A warm, complete landing page for done-for-you services and productised B2B offers: a strip of sample emails, drawn feature illustrations, handwritten notes, one-plan pricing and a founder’s note.

Made for: Outbound agencies, Productised services, B2B consultants
Highlights: Hatched frame and ringed cards
Eight drawn feature illustrations
Problem, solution and three-step system
One-plan pricing and founder's note
The look: Warm paper with a fine grain, stone neutrals and one orange. Headlines are set in Playfair Display with the second half in italic, handwritten notes point at the buttons, the page sits between two hatched rails, and the cards that matter wear a two-tone ring.

Sections

01
Hero
Headline, a short testimonial and a slow-moving strip of sample emails.
02
Problem
What your buyer is stuck with today.
03
Solution
Six cards in an alternating wide and narrow layout.
04
How it works
Three steps on a cream panel.
05
Features
Eight cards, each with a small drawing.
06
Case studies
Results from clients.
07
Pricing
One plan, stated plainly.
08
FAQ
Native disclosures for each question.
09
Founder’s note
A personal note with a signature.
10
Closing
A call to action surrounded by handwritten notes.

Remove a section by deleting its line in app/page.tsx, or move the line to reorder.

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.

Where to change each part of Fourteen
To change	Edit
All copy, links, price, FAQ	site.config.ts
Colours	app/globals.css (@theme)
Fonts	app/layout.tsx
Which sections appear, and in what order	app/page.tsx
Page frame, buttons, rings and handwritten notes	components/ui/Kit.tsx
The small drawings inside the cards	components/visuals/Visuals.tsx

Run it

$ npm install$ npm run dev

Node.js 18.18 or newer. No environment variables.

Before you go live

The buttons point at the closing section: replace them with your booking or sign-up link in site.config.ts. The clients, numbers, quotes and the guarantee are placeholders, so swap them for real ones and only promise what you can deliver.

Specifications

Framework: Next.js 15 (App Router), React 19
Language: TypeScript
Styling: Tailwind CSS v4 with design tokens and component styles
Fonts: Playfair Display, Inter, Caveat, 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: 20 source files, about 1,900 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 Fourteen?

The complete Fourteen 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 Fourteen 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?

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 Fourteen are free. When a new version ships, download it again from the link in your order email.

Can I get a refund?

Yes. If Fourteen 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 Fourteen and every template added later. Three single templates would cost $117.