5 design inspiration sites, and the prompts to use them

The 5 sites

1. 01

   Jiro

   1,200+ website templates and sections (heroes, pricing tables, FAQs, footers, full landing pages), each with a ready-made prompt for Lovable, Bolt, v0, Replit or Cursor. Some are free and the rest sit behind a one-time Pro payment.

   Paste their prompt as-is and you get their site with their words on it. Wrap it in this instead:

   prompt · adapt-a-template.mdCopyCopied

   Here's a website prompt I copied from a template library:
   
   [paste the Jiro prompt here]
   
   Adapt it to my business before you build anything.
   
   My business: [what you sell, in one line]
   My audience: [who buys it]
   My brand: [colours as hex codes, font names]
   My copy: [headline, subheadline, button text, or "write it from my business line"]
   
   Keep the template's layout, spacing and section order. Replace every colour, font, image and piece of text with mine. If a section doesn't fit a business like mine, drop it and tell me why.
   
   Plan it out for me first, before building.

2. 02

   Supahero

   Hundreds of hero sections (the first screen someone sees when they land on a site). It's one long grid with a search bar, which makes it good for a scroll when you don't know what you want yet.

   Screenshot the hero you like and attach it to this:

   prompt · rebuild-a-hero.mdCopyCopied

   I've attached a screenshot of a hero section I like. Rebuild it for my business.
   
   First, tell me what makes it work: the layout, the type sizes, what the eye lands on first, and how it uses empty space.
   
   Then rebuild it with:
   My business: [what you sell, in one line]
   My headline: [your headline, or "write 3 options"]
   My brand: [colours as hex codes, font names]
   Built in: [Claude Code / Lovable / Bolt / plain HTML]
   
   Keep the structure. Don't reuse their text, images or logo.
   
   Plan it out for me first, before building.

3. 03

   Navbar Gallery

   Navigation bars from real websites, sorted into 8 types: static, dropdown, mega menu, sidebar, search bar, announcement, full screen and breadcrumbs. Every entry links to the live site, so you can open it on your phone and see how it collapses before you borrow it.

   prompt · rebuild-a-navbar.mdCopyCopied

   I've attached a screenshot of a navigation bar I like. Rebuild it for my site.
   
   My pages: [the links you need, e.g. Home, Services, About, Contact]
   My main button: [e.g. Book a call]
   My brand: [colours as hex codes, font names, logo file if you have one]
   Built in: [Claude Code / Lovable / Bolt / plain HTML]
   
   Match the layout and spacing. A screenshot can't show hover states or dropdowns, so tell me how you'll handle those. On mobile, collapse it into a menu that still shows my main button, and make sure it works with a keyboard.
   
   Plan it out for me first, before building.

4. 04

   CTA Gallery

   Calls to action from real websites: buttons, signup forms, newsletter boxes, pricing sections and pop-ups. Filter by type or by industry, so you can see what works for a business like yours.

   Screenshot the one you like and attach it to this:

   prompt · rebuild-a-cta.mdCopyCopied

   I've attached a screenshot of a call to action I like. Rebuild it for my site.
   
   First, tell me why it works: how it stands out from the rest of the page, how the words get you to click, and what it asks for (an email, a click, a payment).
   
   Then rebuild it with:
   What I want people to do: [e.g. book a call / join my newsletter / buy the course]
   What they get: [the offer, in one line]
   Where it goes: [e.g. the end of my homepage / a pop-up on my blog]
   My brand: [colours as hex codes, font names]
   Built in: [Claude Code / Lovable / Bolt / plain HTML]
   
   Keep the layout. Don't reuse their words. Give me 3 options for the headline and the button text.
   
   Plan it out for me first, before building.

5. 05

   Posts.design

   2,000+ social posts from 750+ brands like Apple, OpenAI and Figma, filterable by what the post announces: launch, product update, event, hiring, milestone and more.

   Find a post about the same kind of news as yours, then run this in ChatGPT or Gemini (both make images):

   prompt · adapt-a-social-post.mdCopyCopied

   I've attached a social post I like. Make one in the same style for my news.
   
   First, break down why it works: the layout, the type, how much text there is, where the eye goes first.
   
   Then make mine:
   My news: [e.g. we just launched online booking for our salon]
   Platform and size: [LinkedIn 1080x1350 / Instagram 1080x1080 / X 1600x900]
   My brand: [colours as hex codes, font names, logo]
   Text on the image: [your exact words, or "write 3 options under 8 words"]
   
   Keep the layout idea. Use my colours and my words, and no logo but mine.
   
   Plan it out for me first, before building.