Figma Tokens is a Figma plugin allowing you to define and use design tokens in Figma. It allows you to set and create color or typography styles in a granular way by extracting atomic decisions to tokens. Also, it allows you to define reusable values for spacing which you can apply on Auto Layout layers, or set border radious tokens on rectangles that update whenever your tokens change. Think of it like Styles for everything.
Whenever you apply a token to a layer, the plugin will store hidden information on that layer containing information about what token to apply for what property. Whenever your tokens change, we scan the document for any layers containing these hidden information, and update layers accordingly. For Styles, the plugin checks if there is any local style with the same name of your color or typography tokens and updates these.
I will provide more information and some Getting Started videos on my personal website: jansix.at/resources/figma-tokens
- Run
yarnto install dependencies. - Run
yarn build:watchto start webpack in watch mode. - Open
Figma->Plugins->Development->New Plugin...and choosemanifest.jsonfile from this repo. - Create a Pull Request for your branch