Design Tokens
Overview
Design system tokens documentation
Design Tokens
Design tokens are the foundational values of the Integral Design System. They encode visual decisions like color, spacing, typography, and more into reusable, platform-agnostic variables.
These tokens help us:
- Ensure visual consistency across products and components
- Scale design changes without manual refactoring
- Bridge design and engineering through shared language
Tokens are organized by purpose and are available in both SCSS and CSS custom properties. Use them when building components, theming layouts, or aligning styles with Figma specs.
This documentation is a living reference. As the system evolves, tokens may be renamed, merged, or deprecated.