An open API service indexing awesome lists of open source software.

https://github.com/divriots/starter-style-dictionary

Style-Dictionary Starter kit - for Design Tokens
https://github.com/divriots/starter-style-dictionary

Last synced: 29 days ago
JSON representation

Style-Dictionary Starter kit - for Design Tokens

Awesome Lists containing this project

README

          

# Style-Dictionary Starter

This starter-kit is for new users that want to get into Design Tokens with [Style-Dictionary](https://amzn.github.io/style-dictionary/#/).
In this starter we have a basic setup and some examples of tokens and token consumption.

You can find the tokens and their outputs in `/color/src` and `/button/src`, the Style-Dictionary configuration file is `/sd.config.js`

To continue, we recommend reading:

- [Documentation for Style-Dictionary integration in Backlight](https://backlight.dev/docs/style-dictionary).
- [Exporting your Design Tokens to Figma](https://backlight.dev/docs/design-tokens-using-sd-figma)
- [Design Token W3C Draft Specification](https://design-tokens.github.io/community-group/format/) or [our take on this spec](https://backlight.dev/blog/design-tokens).
- [Naming Tokens in Design Systems](https://medium.com/eightshapes-llc/naming-tokens-in-design-systems-9e86c7444676)
- [Naming Design Tokens](https://uxdesign.cc/naming-design-tokens-9454818ed7cb)

If you are starting with [Backlight](https://backlight.dev), check the links below:

- [Explore starter-kits](https://backlight.dev/starterkits)
- [Backlight documentation](https://backlight.dev/docs)
- [Join chat](https://discord.gg/XkQxSU9)