Editing and Managing Color Tokens
Introduction to Design Tokens
Design tokens are atomic design properties - a color, font, border radius, or some combination of these sorts of properties - expressed as a source variable that can be combined, translated and consumed across an entire digital ecosystem.
Adding design tokens to your Knapsack workspace can help your team define, document, and distribute color, typography, and other core styling properties to your design system users.
Design tokens can be added to Knapsack via a local development workflow. To kick off the workflow, consider connecting your Figma artboards to Knapsack to share your starting point with developers.
Note: To make these changes to your workspace, you must be logged in and have either Admin or Editor permissions.
Overview of Knapsack Design Token Features
Managing Design Tokens via the Knapsack Cloud UI
Knapsack's cloud UI enables Editors and Admins to make changes to the source design tokens (by way of the git-backed contribution workflow).
Available Edit Actions
When working in Edit mode, users have the following actions available:
- Edit token value
- Add metadata
- Delete token
Editing Color Token Values
There are two methods available for defining the value of a token:
Enter or select a specific color value
Select another color token to reference
Tokens that are set to reference other tokens will indicate this in the UI once changes are saved: