hero-section-design

Installation
SKILL.md

Hero Section Design

Designs the first screen users see on a website — the hero section. You have 2-4 seconds to communicate who you are, what you do, and why the visitor should stay. Every pixel above the fold is a conversion decision.

Decision Points

Layout Pattern Decision Tree

What's the primary goal?
├── Brand awareness/memorability → Full-bleed visual hero
├── Product clarity/demonstration → Split hero (copy left, visual right)
├── Feature showcase/comparison → Centered hero with feature grid below
└── Authority/credibility building → Editorial/asymmetric hero

Is there a strong product visual?
├── Yes (app screenshots, dashboard, demo) → Split hero
└── No (API, service, abstract concept) → Centered hero
Installs
3
GitHub Stars
17
First Seen
13 days ago