Back to cookbook
Recipe

Marketing landing hero + features

You need a landing page with hero, 3-feature grid, and a CTA section.

Recommended:
v0
Figma Make

Prompt

Use @gunjo/ui. Reference https://gunjo.dev/api/specs/patterns/landing-template.

Build a landing page:
- Hero: full-bleed dark gradient. Centered: small Badge ("Now in beta"), large h1 (text-5xl font-bold), one-line subtitle in text-muted, two Buttons (primary "Get started" / outline "View docs").
- Features section: 3-column Card grid. Each Card has an Icon (lucide-react: Zap, Shield, Layers), title, 2-line description.
- Stats row: 4 inline Statistic components with metric + label.
- CTA: full-width Card with title "Ready to ship?" + Button "Sign up free".
- Footer: minimal, with Separator above and small text + nav links.

Match the design system's gunjō (#4D5AAF) primary color. Don't hardcode — use bg-primary etc.

Expected output

A polished landing page using LandingTemplate, Card, Badge, Button, Statistic, Separator.

Components used

LandingTemplate
Card
Badge
Button
Statistic
Separator