← Atlas · Topics: inspiration, landing-pages, cta
Supahero
- Site
- supahero.io
- Type
- gallery
- Verdict
- Niche
- Licence
- Conditional licence, proprietary free
proprietary-freeFree to browse; paid placements from $79 to $279 per 30 days for featured listings. No reuse licence is stated ("all rights reserved" footer); the heroes belong to the sites shown - Agent channels
- none
- Pricing
- free
- Reviewed
What it is
Supahero is a gallery dedicated to website hero sections: the first screen a visitor sees, with its headline, supporting line, visual and call-to-action. A banner says it is now part of ScreensDesign, an app design library, which it promotes throughout the site.
When to open it
- When you're designing the above-the-fold area of a landing page and want to compare many real approaches side by side.
- When you need to decide between a product-screenshot hero, a typographic hero, a 3D or illustrated hero, or a video hero.
- When you want quick hero references from well-known product sites (Linear, Stripe, Raycast, Attio, Resend and others appear in the list).
Most useful
- About 570 hero screenshots on a single scrolling page, mixing SaaS products, agencies, portfolios, studios and consumer brands.
- A detail page per hero with the site's tagline, the date it was added and a "Visit Website" link.
- A search box to jump to a brand by name.
- A separate list of around 20 Framer templates for when you want a starting point rather than a reference.
- A submission form for suggesting new hero sections.
Using it with agents
No MCP, llms.txt, API or export. Pick two or three heroes that match your product, then describe them to the agent: headline length, where the visual sits, number of CTAs, background treatment and what shows before the fold. Ask it to build the structure with your own copy and branding.
Watch out for
- No filters or tags: browsing is a long scroll or a name search, so you can't narrow by style, industry or layout.
- Sampled entries were dated between October 2024 and December 2025, so newer trends may be missing.
- The Tools page currently shows the same hero list rather than a separate tool directory, and ScreensDesign promotion appears on every page.
Reusable ideas
- Isolating a single section of the page (the hero) makes comparison fast, because every screenshot answers the same question.
- Reading heroes as a set shows the recurring building blocks: one headline, one supporting line, one primary CTA and one strong visual.
- A simple tiered sponsorship table (badge, premium spot, sitewide feature) with stated impression ranges is an easy model for monetizing a niche gallery.
Related
CTA Gallery, Navbar Gallery, Footer Design, VibeUI, Minimal Gallery