Buttons
A polymorphic button (render as a link or any element via `as`). Composed from variant + color + size + rounded. Below the 900px mobile breakpoint, buttons use their brighter hover treatment as the resting state so touch interfaces retain the same visual affordance. Source: src/components/ds/ui/index.tsx.
Variants
primary, secondary, ghost, link, subtle-link, and icon.
Gradient (landing CTA)
The library-landing primary call-to-action, promoted to a Button variant so the styling lives here: an accent→bright gradient with an inner highlight, a colored glow, ink text, and a hover lift. Colors map to the category accents (src/styles/app.css).
Colors
Primary variant across the full color set.
Sizes
xs, sm, md (default), lg.
Rounded
none, md, lg, full.
With icons & states
Buttons accept any children, and forward native props like disabled.
Leading & trailing icons
Icons sit inline with the label (baseStyles gap-2). Lead with an icon to reinforce the action, or trail one for direction, disclosure, or download — across any variant and color.