Components you can see before you copy
Every card is the component's real source, rendered. Open one to see it at desktop and phone widths, in light and dark, and themed by any style. Coding agents get the same components and styles from the read-only MCP server.
7 components
cta
Call-to-action band
Full-width band with one sentence, one line of support, and one action. Accent or quiet surface tone.
faq
FAQ disclosure
Questions in native <details> elements with a plus that turns into a cross when open.
features
Feature grid
Heading and intro above a ruled grid of numbered feature notes. Three, two, or one column by width.
hero
Split hero
Headline, supporting copy, and two actions beside a numbered checklist panel. Stacks on phones.
nav
Simple navigation
Brand, three to five links, and one action. Links collapse into a native disclosure menu on phones.
pricing
Pricing tiers
Plan cards with price, summary, features, and an action. One plan can carry the accent border.
stat
Stat row
Three figures with labels in a ruled row, plus a source line underneath. Stacks on phones.