What CSS and SCSS exports are for
CSS and SCSS exports are simple, flexible ways to use a palette in a website or application. They are useful when you do not need a full framework export but still want reusable variables.
CSS variables
CSS tokens usually appear as custom properties such as color variables. They can be used directly in stylesheets, components, and themes. CSS variables are especially helpful because they can change between light and dark modes without rewriting component styles.
SCSS tokens
SCSS tokens are useful in projects that compile Sass. They can be stored as variables, lists, or maps and reused across mixins, component styles, utility classes, and generated theme files.
Rename raw tokens
The exported tokens may start with generic names. For production systems, rename important values to semantic names that describe their job: background, surface, primary, accent, text, border, success, warning, and danger.
Recommended usage
Use CSS variables for runtime themes and SCSS variables for build-time styling. If your project supports both, keep the token source consistent so designers and developers do not maintain separate color definitions.