Design system primitives: buttons, badges and other building blocks our sections are composed from. Install one and reuse it across your whole project.
1–18 of 18
An uppercase pill button with a trailing seal arrow chip and an optional link.
A minimal text button with an animated underline and arrow for lightweight calls to action.
An async loading button that shows a spinner and disables itself while a promise resolves.
An accessible icon button with a required label, three sizes, and circle or square shape.
A split button with a main action and a separate secondary trigger for menus and options.
A social proof button with an avatar stack inside the pill and a trailing arrow.
A video play button with a circular play seal, label, and duration for showreels and product demos.
A neobrutalist button with a hard offset shadow that lifts on hover and presses in on click.
An editorial pill button with a rolling label and animated icon seal on hover.
A pill button whose label rolls up letter by letter with a staggered hover animation.
A hold to confirm button that fills while held and fires only when the hold completes.
An expanding icon button that reveals its label on hover or focus for compact layouts.
A premium pill button with a diagonal shine sweep on hover for pricing and upgrade actions.
A click to copy button for install commands, API keys, and coupon codes with copied feedback.
A monospace button framed by corner brackets that spring outward on hover.
A scramble text button that cycles random glyphs on hover for developer and tech landings.
A magnetic button that is pulled toward the cursor on hover and springs back on leave.
A compact, softly rounded action button with a solid accent, soft neutral, or hairline outline tone and an optional trailing icon.