Button
An interactive element used to trigger actions, submit forms, or navigate through the interface.
Usage
Buttons are used for primary, secondary, and tertiary actions. Use a primary button for the main action on a page, and secondary or ghost variants for less important tasks.
Content
Primary
The main action button using the brand orange.
Variants
Outline, Ghost, and Destructive variants for different contexts.
Spec
- Padding: 16px horizontal, 10px vertical (Default size).
- Typography: Plus Jakarta Sans, Medium weight.
- Animation: Active state scaling (0.98), focus-visible ring.
- Radius: Medium (0.5rem).
Anatomy
Container (primary)
Label text