Landing pages for AI toolsthat look expensive.

Next.js landing page templates and free shadcn/ui components, made to one standard: every state designed, every change in motion.

Browse templates Explore components

One-time payment
Commercial license
Free updates

Next.js
React
Tailwind CSS
TypeScript
shadcn/ui

“This level of UI micro-interaction is elite.”
@overnotchappon Threads
“Very interesting concept! Mesmerising to watch.”
@browserlondonon Threads
“Fun. Might even be… delightful!”
@dbroche.designon Threads

AI made landing pages cheap. It also made them look the same.

Hairline is for products that should look like themselves: pages designed around their own idea, interactions people notice, and code you own.

No two templates alike
Each template starts from its own concept. Its layout, type, product screens and motion are made for that idea, so your page doesn’t look like the next one.
See all 43 templates
Interactions people notice
Labels morph, numbers roll and buttons show their progress, so a change of state reads as a moment, not a jump. That’s the free component library, and the templates are made with the same care.
Explore the components
Yours, not a dependency
One shadcn CLI command puts the source in your project. No animation library and no provider: components read your shadcn theme and are yours to change.
How installing works

Featured templates

Complete Next.js sites, each with a live demo you can try on every screen size before you buy.

All 43 templates

Browse all 43 templates

Filter by what you're building. Making an AI product? Compare the AI templates.

154 components your coding agent already knows.

Connect Claude Code, Codex, Cursor or any of these once. Ask for a country picker or a chat screen and your agent finds ours, reads its props and installs it with the shadcn CLI, instead of writing its own. Free, no key.

Connect your agent

Launch a Next.js landing page in an afternoon.

Try any template live, make it yours in one file, and ship it the same day.

Inlay
01
Pick a direction
Every template is a complete, original site: its own concept, copy and motion, not a theme with a new colour.
DesktopTabletPhone
14401440px
02
Try it on every screen
Each demo runs as a real build. Switch between desktop, tablet and phone before you spend a cent.
site.config.ts
export const site = {
brand: "Acme",
accent: "#305dde"
cta: "Start free",
};
Deploy
03
Make it yours, then ship
Words, links, prices and colours live in one config file. Change them, deploy anywhere Next.js runs.

Built by one person, after the day job.

I’m @9to5_dad. I build Hairline UI one template at a time, each from its own idea, and I check everything on my phone before it ships.

Tell me what’s missing. The MCP server exists because someone on Threads asked for it.

Talk to me on Threads

Pay once, keep it forever.

Every demo is free to explore, 5 templates are free to download, and every purchase includes a commercial license.

Free

No card needed

$0with an account

Relay, Tempo, Stillform, Fourteen and Index

5 complete Next.js templates, ready to run
Download from your account, no card needed
Commercial license for unlimited projects
Free updates to these templates

Create a free account

Single template

One complete project

$39one-time

Pick any template in the catalog.

The complete Next.js template, ready to run
Every word, link and price in one config file
README with setup, customisation and copy guide
Commercial license for unlimited projects
Free updates to this template

Choose a template

All-access

Best value

$99one-time

$1,482 if you bought every template on its own

Every template in the library, each a complete project
Every template we release later, at no extra cost
Commercial license for unlimited projects
Free updates to every template

Get All-Access

Already have an account? Sign in

Questions, answered.

Licensing, the stack and downloads, without the fine print.

Still deciding? Try any demo

$39 for one template, or $99 for every template in the library plus each one added later. Both are one-time payments with a 14-day money-back guarantee. Relay, Tempo, Stillform, Fourteen and Index are free with an account.

Yes. Every purchase includes a commercial license: use a template for your own products and any number of client projects. You just can’t resell the template files themselves as a template or UI kit.

Every template runs as a real, isolated build. The demo viewer lets you switch between desktop, laptop, tablet and phone widths in your browser before you buy.

Each template is a standalone Next.js project with React and TypeScript. Styling uses Tailwind CSS or plain CSS, listed on each template’s page. No API keys or environment variables needed to run it.

Everything downloads from your account. The free templates are there as soon as you sign in, and a template or All-Access unlocks right after checkout. Unzip the project, run npm install and npm run dev.

Yes. Every component in the library is free to install from our shadcn registry, with its source, states and motion included, and no account needed. Templates are the paid part, apart from the 5 you can download free with an account.

Yes. They install with the shadcn CLI into your components folder and read your theme’s CSS variables, so they match the rest of your app in light and dark. There’s no provider or animation library to add.

Yes. Connect Claude Code, Codex, Cursor or any MCP client to the Hairline MCP server and ask for what you need, by name or by what it should do. Your agent finds the component, reads its props and installs it. Setup is on the AI and MCP page in the docs.

shadcn/ui gives you primitives and sections to assemble yourself. Hairline templates are finished sites, each designed around its own idea, and the components are the interactions you would otherwise build by hand. They install next to shadcn/ui and use its theme.

Yes, regularly. All-Access holders get every new template at no extra charge. There are 43 today.