Alternatives list

[nekitk]

Search sources:

• Main search term: design tokens
• https://github.com/sturobson/Awesome-Design-Tokens#tools

Code is the source of truth

• Style Dictionary by Amazon https://amzn.github.io/style-dictionary
  • Single config -> ios/android/web/Sketch/docs
  • Main goal is multiplatform export from shared config and assets
• Theo by Salesforce https://github.com/salesforce-ux/theo
  • Single config -> ios/android/web/custom formatters
  • Same goal as Style Dictionary: multiplatform export
• Figma plugin "Figma Tokens" https://www.figma.com/community/plugin/843461159747178978/Figma-Tokens
  • JSON <-> Figma
  • We can potentially integrate with it instead of writing own plugin
• Specification https://system-ui.com/theme/
  • Specified format for storing design tokens with theming support
  • May seem abandoned, but is used in Theme UI: https://theme-ui.com/theme-spec
• Specification https://udt.design/
  • Not updating, only bumping dependencies

Design is the source of truth

• Figma plugin "Design Tokens" https://github.com/lukasoppermann/design-tokens
  • Figma -> JSON
• Figma plugin "Figmatic" https://github.com/mikaelvesavuori/figmagic
  • Figma -> JS (https://github.com/mikaelvesavuori/figmagic-example/blob/master/tokens/colors.ts)
• Figgo (cli tool) https://github.com/B3nnyL/figgo
  • Figma -> JS/CSS/SCSS
• Web app DSM https://www.toolabs.com/
  • Can export to CSS and other formats
• Web solution: https://gustavoquinalha.github.io/design-tokens-generator/
  • Exports to SASS/JSON

[nekitk]

https://github.com/bem/themekit