GalleryInspiration
Supahero
Hundreds of website hero sections from real sites, nothing else.
What it is
Supahero is a gallery of hero sections only: the first screen of real websites and portfolios, from Figma, Linear and Stripe down to small studios and individual designers. Each one links to a detail view and the live site. It's now part of screensdesign, a larger app screen library, but the hero gallery is still browsable for free.
Why it’s here
The hero is the one part of a landing page everyone sees, and the part where "make it modern" produces the same centred headline every time. A page of nothing but heroes shows how much variety there is in layout, type size and what sits next to the copy. Use it to pick a shape before you write the prompt.
Best for
- hero section layouts
- landing-page first screens
- headline and type sizing
Can my agent use this?
Agent limited agent friendlinessAs a reference only. Choose one or two heroes, give your agent the screenshot and the live URL, and describe the layout in words: headline width, where the visual sits, how many actions. That's enough for it to build a hero with the same bones.
Limited: Mainly a visual reference. Great for humans and for describing a direction, but there's little an agent can read or install.
Access methods
- Public website
Related resources
SaaS Landing Page SaaS Landing Page
Landing page examples organised by the exact section you're stuck on.
GalleryFreelimited agent friendlinessNavbar Gallery 
Navbar Gallery
550+ real website navbars, sorted by type: mega menus, sidebars, tabs and the rest.
GalleryFreelimited agent friendlinessLand-book Land-book
A big, searchable gallery of landing pages, filterable by style, colour and industry.
Gallerylimited agent friendlinessGodly 
Godly
Astronomically good web design inspiration, hand-picked.
GalleryFreelimited agent friendlinessStaff pickUsed by me