README
Design Tokens
Design tokens are the atomic elements of our design system. They are named entities that store visual design attributes and export them in convenient formats that are ready for integration into your apps and websites.
We recommend using design tokens in place of hard-coded values (such as hex values for color) in order to maintain a scalable and consistent UI.
Design tokens are currently exported in the following formats: xml
, css
, .h
, .m
, json
, js
, and scss
.
Install
:warning: IMPORTANT: This README provides instructions on using the package
@velo-design-system/tokens
. The contents of this package are programmatically generated from our design libraries. To understand how this process works in more detail, please refer to the CONTRIBUTING.md
Recommended Install
$ yarn add @velo-design-system/tokens -D
$ yarn
Preview upcoming releases
$ yarn add @velo-design-system/tokens@next --dev
$ yarn install
Usage
The design tokens package is comprised of the following primitive types:
colors
typography
layout
component-tokens
General guidelines on using these tokens can be found on the design system website.