https://github.com/divriots/starter-figma-tokens
Figma Tokens Plugin starter kit
https://github.com/divriots/starter-figma-tokens
Last synced: 11 months ago
JSON representation
Figma Tokens Plugin starter kit
- Host: GitHub
- URL: https://github.com/divriots/starter-figma-tokens
- Owner: divriots
- License: mit
- Created: 2022-05-19T09:34:42.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2022-09-15T15:05:44.000Z (over 3 years ago)
- Last Synced: 2025-07-18T07:44:20.782Z (11 months ago)
- Language: CSS
- Homepage: https://studio.backlight.dev/doc/cKyQDXe8ZMFwcmJsOYD9
- Size: 52.7 KB
- Stars: 1
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme/doc/index.md
- License: LICENSE
Awesome Lists containing this project
README
# Starter Figma Tokens
This starter kit is for users that want to use [Figma Tokens Plugin](https://www.figma.com/community/plugin/843461159747178978/Figma-Tokens) in [Figma](https://www.figma.com/) as a starting point to build their Design System.
This kit shows an automated workflow, where your design tokens source of truth is in the Figma Tokens Plugin.
Whenever you update the tokens and push to GitHub, the coded components inside Backlight will automatically update, in a pull request!
Full documentation about setting up this workflow can be found in our [Figma Tokens Docs](https://backlight.dev/docs/figma-tokens).
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)
## Workflow Summary
- Designer changes some tokens in Figma Tokens Plugin and pushes the changes to GitHub.
- A pull request is created automatically in GitHub through GitHub Actions
- Style-Dictionary is ran and results are added to this PR automatically through GitHub Actions
- A Backlight preview link will appear in the PR
- Designers (& optionally developers) can see visual changes and review + approve
- Changes are merged into main
Code & Design, will be in sync 🎉 and designers will have more autonomy.