Tokenscript is a dsl that interprets design tokens.
With Tokenscript you can write custom functions and ship logic directly with your design tokens.
This is an early public release. This project is under active development.
Tokenscript is a domain-specific language with a compliance library because it provides a small subset of common language features, enabling fast and secure implementation without the complexity of thousands of custom transform functions with different color types.
The result is a powerful, type-safe environment that extends your design system capabilities.
- Custom Types and Units: Define and support custom types and units without relying on platform support
- Token Computation: Perform complex calculations and transformations on your design tokens
- Schemas: Combine custom functions as schemas to ship logic alongside your token data
Tokenscript is designed for tool builders and developers who want to extend the language. While Tokenscript itself is not a tool to transform tokens, complementary tools can interpret and permutate token data using the language.
npm i --save @tokens-studio/tokenscript-interpreter
Tokenscript enables tool builders to work efficiently with design token data.
The fastest way to get started is by using the interpretTokens function with your token json data:
import { interpretTokens } from "@tokens-studio/tokenscript-interpreter";
const tokens = {
"primary-color": {
"$value": "#ff6b35",
"$type": "color"
},
};
const result = interpretTokens(tokens);
// => {"primary-color": "#ff6b35"}import { interpretTokens } from "@tokens-studio/tokenscript-interpreter";
const tokens = {
"primary-color": {
"$value": "#ff6b35",
"$type": "color"
},
"secondary-color": {
"$value": "{primary-color}",
"$type": "color"
}
};
const result = interpretTokens(tokens);
// => {"primary-color": "#ff6b35"
// "secondary-color": "#ff6b35"}Your desired token features are not tied to any specification or library — enable features by loading the schemas you need.