Design-first

Build your front end with Bolt.new

Spin up a full front end in the browser, then merge its look into the template.

Best for: Fast prototypers who want a whole running app to react to, not just components.

The prompt

Copy this, fill in the [bracketed] parts, and paste it into Bolt.new.

Build a Next.js front-end prototype for [YOUR BUSINESS] — [what you do]. Focus on layout, design, and marketing copy. Do NOT implement authentication or connect to any backend API — a production template already does that securely and I will merge your design into it.

Include: a marketing home (hero, value props, services, footer), a services page, a contact page, and a signed-in dashboard shell. Brand color [color], mobile-first, accessible. Use semantic, re-themeable colors rather than fixed hex values. Leave any data-driven area as a clearly marked placeholder.

How to do it

Prototype in Bolt
Paste the prompt. Bolt builds a running app you can click through and refine — great for settling the layout and copy.
Fork the real template
Separately, fork BringTheFront (Setup Guide). This is the app you actually deploy — it carries the secure backend connection.
Merge the look
Bring Bolt's design over: open the template in Cursor or Claude and ask it to reproduce Bolt's layout and styling on the template's pages, keeping lib/api and middleware untouched.
Verify + deploy
pnpm verify, then push and deploy on Vercel.

Watch out for

Bolt will happily scaffold its own auth and fake API. Treat that as throwaway — the template's connect layer is the real one. Merge Bolt's look, not its plumbing.
Prototype and production are two repos here. Do not deploy the Bolt project directly; deploy the template with Bolt's design applied.

Ready to bring your front?

Create your backend first, then use Bolt.new to build the front that connects to it.

Start free →Read the Setup Guide

Build a Next.js front-end prototype for [YOUR BUSINESS] — [what you do]. Focus on layout, design, and marketing copy. Do NOT implement authentication or connect to any backend API — a production template already does that securely and I will merge your design into it. Include: a marketing home (hero, value props, services, footer), a services page, a contact page, and a signed-in dashboard shell. Brand color [color], mobile-first, accessible. Use semantic, re-themeable colors rather than fixed hex values. Leave any data-driven area as a clearly marked placeholder.

How to do it

Prototype in Bolt

Paste the prompt. Bolt builds a running app you can click through and refine — great for settling the layout and copy.

Fork the real template

Separately, fork BringTheFront (Setup Guide). This is the app you actually deploy — it carries the secure backend connection.

Merge the look

Bring Bolt's design over: open the template in Cursor or Claude and ask it to reproduce Bolt's layout and styling on the template's pages, keeping lib/api and middleware untouched.

Verify + deploy

pnpm verify, then push and deploy on Vercel.