Subscribe
Sign in
p/design-tokens-extractor-for-figmaAn API for extracting Design Tokens from your Figma document
Start new thread
Fredrik Ward

Design Tokens Extractor for Figma - An API for extracting Design Tokens from your Figma document

by•

This API wraps the Tropos engine. The Tropos engine is powering the Stratos Tokens App* by Team Sketch2React Extract your Design Tokens from your Figma document as json data and use it for e.g: - MaterialUI Theming - CSS-in-JS - input for Style Dictionary

Add a comment

Replies

Best
Fredrik Ward
Maker
📌
We, at Team Sketch2React, have created a design API that share the same design token engine, The Tropos Engine, as our popular Stratos Tokens App. The design token engine is the core part of Stratos Tokens App that handles the extraction of design token data from your design documents. We have been thinking for a long time about how we could somehow make the Tropos Engine stand-alone. Then it dawned on us! Let’s wrap the engine in a design API. Because if we could make the design token engine stand-alone we could use it to add design token management to our automated workflows. And if we could, then we guessed others would like to as well, given the opportunity.
Alice Banners
@freedruk Great job on creating a design API, Team Sketch2React! It's awesome that the Tropos Engine can now be used to add design token management to automated workflows. Your idea to wrap the engine in a design API is brilliant and I'm sure many others will find it valuable too. Keep up the great work!
Fredrik Ward
Maker
@alicebanners Thank you! We, at Team Sketch2React, are using it ourselves in our products Sketch2React 2022 and Marcode. For us it has greatly simplified our design to code workflow and helping us keeping visual consistency between our products.
Fredrik Ward
Maker
A great thing about the api is since it's build around the same core as Stratos Tokens app every tutorial and all documentation written about Stratos Tokens is applicable to this API. A good place to start would be here: https://sketch2react.gitbook.io/... Enjoy!