All Heroes blocks
Hero 9
Page header with supporting visual
A balanced hero that pairs a clear page title and primary actions with a strong supporting image. Works well when you want more visual context than a minimal header, without going full marketing hero. Ideal for feature overviews, product detail pages, or campaign landing pages where clarity still comes first.
Pro Marketing Figma React
All blocks
More Heroes
Pro
Hero 1
Centered headline with media hero
Pro
Hero 2
Full-bleed background with centered content
Pro
Hero 3
Light background with centered content
Pro
Hero 4
Soft gradient hero with dual CTAs and rating
Pro
Hero 5
Split layout with waitlist capture
Pro
Hero 6
Feature-led split hero
Pro
Hero 7
Editorial story hero
Pro
Hero 8
Minimal page header
Pro
Hero 10
Full-bleed image hero
Benefits
Production-ready by default
Built with shadcn/ui conventions and designed for real projects.
Built with shadcn/ui
Clean React components using Tailwind and modern shadcn patterns.
Install instantly
Add the block directly using the shadcn CLI.
Works with your theme
Compatible with shadcn themes and token-based color systems.
MCP server support
Use shadcn MCP server right from your favorite AI tools.
