Design tokens
Take advantage of Seeds' core styles in your code, no matter what technologies you use.
Design tokens documented on Seeds are available as variables for a variety of platforms that can be installed via your package manager of choice. Using the official Seeds packages means you'll get any future updates to our values and allows you to copy and paste variable names from the Seeds website directly into your code.
On versioning:
Seeds packages use Semantic Versioning so that consumers can easily understand the types of changes between two versions by comparing the version numbers. All version numbers follow this format: major.minor.patch
When we release updates to these packages, we follow these guidelines when bumping the version numbers:
major
is incremented when there are breakinng changesminor
is incremented when non-breaking features are addedpatch
is incremented when a bug is fixed
Color
v2.2.0Yarn
yarn add @sproutsocial/seeds-color
npm
npm install @sproutsocial/seeds-color --save
File structure
- seeds-color
Network color
v2.19.0Yarn
yarn add @sproutsocial/seeds-networkcolor
npm
npm install @sproutsocial/seeds-networkcolor --save
File structure
- seeds-networkcolor
Typography
v3.6.0Yarn
yarn add @sproutsocial/seeds-typography
npm
npm install @sproutsocial/seeds-typography --save
File structure
- seeds-typography
Space
v0.8.0Yarn
yarn add @sproutsocial/seeds-space
npm
npm install @sproutsocial/seeds-space --save
File structure
- seeds-space
Border
v1.6.2Yarn
yarn add @sproutsocial/seeds-border
npm
npm install @sproutsocial/seeds-border --save
File structure
- seeds-border
Motion
v1.7.0Yarn
yarn add @sproutsocial/seeds-motion
npm
npm install @sproutsocial/seeds-motion --save
File structure
- seeds-motion