Theemo - The yordle powered theme automator
Theemo is a javascript library to automate your theme workflow by enhancing your already existing toolchain and connecting multiple tools together.
- Sync from your Design Tool to your Token Manager Tool
- Trigger the build of your Token Manager Tool
- Generates a ready-to-consume, adoptive CSS theme
- Use one or all features - choice is yours
Documentation
You will find the documentation at gossi.github.io/theemo.
Check out the Getting Started for a head-start with theemo.
Contribute
I'm calling for your help to improve theemo. Spin it up for your project, consult the documentation and benefit from your now-faster-workflow.
Is the documentation good? Where it is unclear? What were your obstacles in understanding (parts of) it?
Are you using another tool than Figma or Style Dictionary? Maybe Sketch, Framer X or Adobe XD as your design tool? Or do you use Theo as your token manager tool? These are at the moment unfortunately all not included but I'd like to see support for them and good thing is the architecture of theemo already allows to plug-in extensions for other tools.
For all cases, please reach out to the theemo repository, open issues for questions or discussion - or submit a PR =)
References
Articles helped building theemo or share experiences with it.
- Anne, J. & Levine, J. (2016). Using Design Tokens with the Lightning Design System [Video file]
- Carlin, E. (2020). The Theory: A Semantic Color System [Blog Post]
- Curtis, N. (2016). Tokens in Design Systems [Blog Post]
- Gossmann, T. (2020a). From Figma to Ember to Storybook … with 2 Clicks [Blog Post]
- Gossmann, T. (2020b). Full Featured Themes in Figma [Blog Post]
- Gossmann, T. (2020c). Say Hello to Theemo - the Yordle Powered Theme Automator [Blog Post]
- Laptev, P. (2019). Design tokens with Figma [Blog Post]
- Manandhar, I. (2020). Design Tokens: How to use them effectively [Blog Post]