@amedia/brick-tokens v0.0.34

brick-tokens

From Figma to Brick: Design Tokens

Using Figmagic to read figma api and update the design tokens and the graphics

https://github.com/mikaelvesavuori/figmagic

Create your token and add an .env file (look at .example.env)

npm run figmagic

example:

figmagic --token your-figma-token --url khngYEYm4PVNEKOjNpOn9C // demo
figmagic --token your-figma-token --url Jm2ChrupQy3hQPD8yGNXWp // Amedia Brick Design for IU

The new and hot CSS-in-JS kid in town, Stitches, is used for themeing and variants:

https://github.com/modulz/stitches/tree/canary/packages/core

Other example also using Figmagic, or other tools

https://www.skypack.dev/view/@velove/design-system

Other info: https://blog.prototypr.io/design-tokens-with-figma-aef25c42430f https://noti.st/klaufel/RFcTe9 https://github.com/renatewr/pattern-library-skeleton (https://www.figma.com/file/IGr2xoqcZX91CU7CDr4ZsI/Design-tokens-(skeleton)?node-id=167%3A391) https://github.com/PavelLaptev/wunderzin/blob/master/style-dictionary/build.js