SiteHero is an AI-powered hero section generator for marketers, founders, designers, and PLG teams.
It transforms a simple prompt into a complete hero section — image, headline, subheadline, CTAs, and production-ready code.
This public repo provides a high-level overview, architecture, screenshots, and product direction.
The full production code lives inside the private PlayHero monorepo.
SiteHero makes landing page creation fast and accessible:
- AI-generated hero images
- AI-written headlines & subheadlines
- Conversion-optimized CTAs (PLG + Sales-Led motions)
- Instant code export (React, Next.js, HTML)
- Template library for different SaaS verticals
- “Hero of the Day” — dynamic daily hero inspiration
- Figma-to-code transformer
- Startup program (“Hero for Startups”)
- Refer-a-Hero referral program
It’s the fastest way to design, test, and ship high-performing hero sections.
- Product-Led (PLG): Free Trial, Freemium, Start Now
- Sales-Led: Request Demo, Contact Sales
- Hybrid: Mix of both
SiteHero automatically optimizes hero sections for each motion’s best practices.
AI engine that creates hero images, headlines, subheadlines, and CTAs.
A growing set of PLG, SaaS, Enterprise, and Startup hero templates.
A dynamic daily section showcasing trending hero layouts.
Upload a Figma frame → receive production-ready Tailwind/Next.js code.
Real-time hero preview with theme + layout toggles.
“Refer a Hero” program + startup discounts.
sitehero
├── generator
│ ├── image
│ ├── headline
│ ├── subheadline
│ ├── cta
│ └── layout
│
├── templates
│ ├── plg
│ ├── sales-led
│ ├── hybrid
│ └── industry-verticals
│
├── hero-of-the-day
│ ├── feed
│ └── preview
│
├── figma-to-code
│
└── ui
├── previewer
├── components
└── layout- Next.js 15 (App Router + RSC)
- Vercel (deploy, edge, AI SDK)
- Supabase (auth, data storage, real-time)
- Tailwind + shadcn/ui
- TypeScript
- PlayHero DSv1 Design System
- End-to-end hero creation (prompt → image + copy + code)
- PLG + Sales-Led template support
- AI conversion-optimized copywriting
- Daily hero inspiration feed
- Figma → code transformation
- Code export (Next.js, React, HTML)
- Integrated PlayHero design tokens
- Ready-made demos for early-stage SaaS teams
- Template expansion (vertical-specific hero patterns)
- Enhanced image generation quality
- DSv1 integration + UI refinements
- Multi-step hero wizard
- Team library + save feature
- Code export enhancements
- Startup referral program dashboard
- SiteHero (Beta) → https://sitehero.app
Mike Greeves — Founder, PlayHero
- LinkedIn — https://www.linkedin.com/in/michaelgreeves
- X — https://x.com/mjgreeves
- Web — https://www.webux.ai
Always building, always shipping.