Design Tokens
Design tokens are fundamental building blocks that capture design decisions, enabling consistency and scalability across projects.
Search
Design tokens are the building blocks of Kernel Design System, ensuring consistency and scalability across all designs. By encapsulating key design decisions—such as colors, typography, spacing, and more—tokens enable a systematic and reusable approach to design.
Kernel utilizes Figma Native Variables to implement and manage its design tokens, creating a seamless connection between design tools and the design system.
Core Tokens
Represent the foundational values like base colors, type scales, and spacing units.
These tokens are universal and not tied to any specific use case.
System Tokens
Define functional use cases, such as background colors, text colors, or icon color styles.
Build on Core Tokens to provide structure and application-specific guidance.
Component-Specific Tokens
Tailored to individual components to address their unique design needs.
Ensure consistency within a component while allowing flexibility for variations.