Button Tokens

Button components using semantic design tokens for consistent styling across all platforms.

Primary Buttons

Main call-to-action buttons

Supporting action buttons

Bordered button variants

Design token reference for button components

--button-bgvar(--color-brand)

--button-bg-hovervar(--color-brand-hover)

--button-textvar(--color-text-on-brand)

--button-border-radiusvar(--radius-lg)

--button-padding-xvar(--spacing-5)

--button-padding-yvar(--spacing-2-5)

--button-height-sm40px

--button-height-md48px

--button-height-lg56px