-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
21 changed files
with
491 additions
and
294 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,46 +1,16 @@ | ||
# Theemo - The yordle powered theme automator | ||
# Theemo - Design Token Automations | ||
|
||
Theemo is a javascript library to automate your theme workflow by enhancing your | ||
already existing toolchain and connecting multiple tools together. | ||
Theemo automates your design tokens by connecting your existing tools and make them work together, from design to framework integration. The theemo suite consists of multiple parts to serve a multi-disciplinary audience by bringing them together for an immersive workflow. | ||
|
||
- **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 | ||
- Design: Automate Design in your Design Tool (eg. Figma). | ||
- [CLI](./packages/theemo): Blend into your existing toolchain | ||
- Frameworks: Integrate the generated design tokens into your framework of choice. | ||
|
||
## Documentation | ||
|
||
You will find the documentation at | ||
[gossi.github.io/theemo](https://gossi.github.io/theemo). | ||
[theemo.io](https://theemo.io). | ||
|
||
Check out the [Getting | ||
Started](https://gossi.github.io/theemo/docs/getting-started) for a head-start | ||
Started](https://theemo.io/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]](https://www.youtube.com/watch?v=wDBEc3dJJV8) | ||
- [Carlin, E. (2020). The Theory: A Semantic Color System [Blog Post]](https://dev.to/ynab/a-semantic-color-system-the-theory-hk7) | ||
- [Curtis, N. (2016). Tokens in Design Systems [Blog Post]](https://medium.com/eightshapes-llc/tokens-in-design-systems-25dd82d58421) | ||
- [Gossmann, T. (2020a). From Figma to Ember to Storybook … with 2 Clicks [Blog | ||
Post]](https://gos.si/blog/from-figma-to-ember-to-storybook-with-2-clicks) | ||
- [Gossmann, T. (2020b). Full Featured Themes in Figma [Blog Post]](https://gos.si/blog/full-featured-themes-in-figma) | ||
- [Gossmann, T. (2020c). Say Hello to Theemo - the Yordle Powered Theme | ||
Automator [Blog Post]](https://gos.si/blog/say-hello-to-theemo---the-yordle-powered-theme-automator) | ||
- [Laptev, P. (2019). Design tokens with Figma [Blog Post]](https://blog.prototypr.io/design-tokens-with-figma-aef25c42430f) | ||
- [Manandhar, I. (2020). Design Tokens: How to use them effectively [Blog | ||
Post]](https://uxdesign.cc/design-tokens-how-to-use-them-effectively-d495ff05cbbf) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
# Contribute to Theemo | ||
|
||
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 =) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
# Theemo CLI | ||
|
||
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 | ||
[theemo.io](https://theemo.io). | ||
|
||
Check out the [Getting | ||
Started](https://theemo.io/getting-started) for a head-start | ||
with theemo. |
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.