Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/growingio/gio-design-tokens
GrowingIO Design Tokens
https://github.com/growingio/gio-design-tokens
design-system design-tokens growingio
Last synced: 2 months ago
JSON representation
GrowingIO Design Tokens
- Host: GitHub
- URL: https://github.com/growingio/gio-design-tokens
- Owner: growingio
- License: apache-2.0
- Created: 2020-12-18T05:05:09.000Z (about 4 years ago)
- Default Branch: master
- Last Pushed: 2023-03-02T21:58:43.000Z (almost 2 years ago)
- Last Synced: 2024-04-18T07:01:54.007Z (9 months ago)
- Topics: design-system, design-tokens, growingio
- Language: JavaScript
- Homepage: https://gio-design-tokens.vercel.app
- Size: 994 KB
- Stars: 4
- Watchers: 8
- Forks: 2
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG-20.x.md
- License: LICENSE
- Security: SECURITY.md
Awesome Lists containing this project
README
# GrowingIO Design Tokens
Design tokens are the visual design atoms of the design system — specifically, they are named entities that store visual design attributes. We use them in place of hard-coded values (such as hex values for color or pixel values for spacing) in order to maintain a scalable and consistent visual system for UI development.
## How it works
All of the style properties and assets are in this package. Make any changes to suit your needs.
To build package, run
```bash
$ cd gio-design-tokens
$ yarn build
```The npm build task is what performs the style dictionary build steps to generate the files for each platform. Every time you change something in the style dictionary, like changing colors or adding properties, you will have to run this command again to generate the files.
To preview tokens, run
```bash
$ yarn storybook
```