Design tokens are the named values that define Anvil’s visual language — colors, spacing, typography, and more. They create a shared vocabulary between design and code, so decisions made in Figma reflect accurately in production. Use this page to browse and reference available tokens by category.Documentation Index
Fetch the complete documentation index at: https://anvil.servicetitan.com/llms.txt
Use this file to discover all available pages before exploring further.
Token tiers
- Primitives — raw values (specific hex colors, pixel sizes). Not intended for direct use in product code.
- Semantic tokens — values with purpose (e.g.
background.color.primary). Use these in most cases. - Component tokens — values scoped to a single component (e.g.
button.primary.background.color). Use when customizing one component.
Token categories
The table below is organized into the following categories:- Color — Background, Foreground, Border, Status, Focus, Overlay, Shadow
- Typography
- Spacing (size)
- Radius
- Duration / Transition
- Breakpoint
- Opacity
- Gradient