Bolt templates
Best HTML templates for Bolt
BrowserMoon is a library of HTML templates for Bolt. Every template is a modern, professional design that Bolt uses as a visual reference to build around. Pick any template, paste it into your Bolt prompt with your product description, and get a polished AI website, SaaS landing page, or app from the first generation.
Bolt templates by category
How to use Bolt templates from BrowserMoon
Pick a template
Browse the BrowserMoon gallery and choose the template you need. Every template covers a specific part of a product page: hero sections, navigation bars, pricing tables, features grids, footers, and more.
Copy the code
Click any template to open its detail page. Click Copy code. The full HTML is now on your clipboard.
Paste into Bolt
Open Bolt at bolt.new. Paste the HTML into your prompt and describe your product. Tell Bolt what headline to use, which colors match your brand, and what the CTA button should say.
Iterate with targeted prompts
Use short follow-up prompts to adjust specific elements. Bolt makes surgical edits without restyling the design you started with.
Why use HTML templates with Bolt
Bolt builds complete apps fast, but the visual quality depends on the design reference you give it. Without a template, Bolt produces a generic layout that needs multiple rounds of iteration before it looks like a real product.
A BrowserMoon template gives Bolt a professional visual starting point. Every subsequent prompt in that session builds on a design that already looks polished, rather than correcting a generic scaffold.
Browse Bolt templates
All templates work with Bolt. Browse the full library for hero templates, navbars, pricing, features, footers, and more.
Browse all templatesFrequently asked questions
What are Bolt templates?
Bolt templates are pre-built HTML templates you paste into a Bolt prompt to give your project a production-quality design baseline. BrowserMoon Bolt templates are self-contained HTML files with no external dependencies, no npm install, no framework, no build step.
How do I use a BrowserMoon template in Bolt?
Copy any template from BrowserMoon, open Bolt at bolt.new, and paste the HTML into your prompt. Describe your product and what you want to change. Bolt adapts the template to your product while keeping the design intact.
Do Bolt templates work with React and Tailwind?
Yes. Include 'convert to React with Tailwind classes' in your Bolt prompt and it will translate the BrowserMoon template from inline-styled HTML to a Tailwind component. The layout, spacing, and typography values are preserved.
Can I use multiple BrowserMoon sections in the same Bolt project?
Yes. Copy each template separately and describe in your prompt how they should connect. Bolt assembles the templates into a full page layout and adapts the content to your product across all of them.
How do I get BrowserMoon Bolt templates?
BrowserMoon templates are available to copy from any template detail page. Browse the gallery, open a template, and click Copy code.
Related