Expand description
Fixed semantic token vocabulary for ferro-theme/v2.
Defines ~30 semantic slots that every theme must provide. Tokens are
CSS custom properties resolved by the Tailwind v4 @theme directive.
Components reference them as utility classes (bg-primary, text-surface, etc.).
Constants§
- ALL_
TOKENS - All token names in the ferro-theme/v2 vocabulary (30 slots).
- TOKEN_
ACCENT - Accent color for decorative highlights.
- TOKEN_
BACKGROUND - Background of the page.
- TOKEN_
BORDER - Default border color.
- TOKEN_
CARD - Card background (further raised above surface).
- TOKEN_
COLOR_ RING - Focus-visible ring color for interactive components.
- TOKEN_
DESTRUCTIVE - Destructive / danger actions.
- TOKEN_
FONT_ DISPLAY - Display/heading font family; defaults to var(–font-sans).
- TOKEN_
FONT_ MONO - Monospace font stack.
- TOKEN_
FONT_ SANS - Sans-serif font stack.
- TOKEN_
MOTION_ DURATION_ BASE - Base transition duration (dropdowns, modals, toasts). Default: 220ms.
- TOKEN_
MOTION_ DURATION_ FAST - Fast transition duration (micro-interactions: hover, toggles). Default: 120ms.
- TOKEN_
MOTION_ DURATION_ SLOW - Slow transition duration (drawers, page-level reveals). Default: 320ms.
- TOKEN_
MOTION_ EASE - Standard easing curve (calm, settled, no bounce).
- TOKEN_
PRIMARY - Primary action color (buttons, links, highlights).
- TOKEN_
PRIMARY_ FOREGROUND - Foreground color on primary backgrounds.
- TOKEN_
RADIUS_ FULL - Full (pill) border radius.
- TOKEN_
RADIUS_ LG - Large border radius (cards, modals).
- TOKEN_
RADIUS_ MD - Medium border radius (default for most elements).
- TOKEN_
RADIUS_ SM - Extra-small border radius.
- TOKEN_
SECONDARY - Secondary action color.
- TOKEN_
SECONDARY_ FOREGROUND - Foreground color on secondary backgrounds.
- TOKEN_
SHADOW_ LG - Large shadow (modals, popovers).
- TOKEN_
SHADOW_ MD - Medium shadow (floating panels).
- TOKEN_
SHADOW_ SM - Subtle shadow (inputs, small cards).
- TOKEN_
SPACING - Base spacing unit; all spacing utilities resolve as calc(var(–spacing) * N).
- TOKEN_
SUCCESS - Success / confirmation state.
- TOKEN_
SURFACE - Raised surface above background (panels, sidebars).
- TOKEN_
TEXT - Primary text color.
- TOKEN_
TEXT_ MUTED - Muted/secondary text color.
- TOKEN_
WARNING - Warning / caution state.