Skip to main content

Design Token

Design Token are the smallest building blocks, the core pieces of a design system. Design Token in kickstartDS are stored in a JSON format and can be transformed to be used on any platform.

Core Token​


_10
"color": {
_10
"primary": "#05566a",
_10
"primary-inverted": "#ecff00",
_10
"background": "#fff",
_10
"foreground": "#050505",
_10
"link": "#5D5DD5",
_10
"link-inverted": "#C6C6FF"
_10
},

Explore all color Token

Semantic Token​

Semantic Token reference core Token and suggest an intended use for it. Because of this their names should never reference the value but only what the Token is intended for. They have a high level of abstraction. A typical name could be color-background or shadow-floating-hovered.

The kickstartDS Token taxonomy relies on the article Naming Token in Design Systems by Nathan Curtis, who really is the number one mate in the design systems space. Thank you for sharing you passion and knowledge, this is really empowering the DS community 🙏