Colors

Edit the variables within the variables panel to the change affect the entire library. Here you can also gain a quick overview of all the variables you are currently using in your project.

Color Primary

class

primary-50

hexcode

class

primary-100

hexcode

class

primary-200

hexcode

class

primary-300

hexcode

class

primary-400

hexcode

class

primary-500

hexcode

class

primary-600

hexcode

class

primary-700

hexcode

class

primary-800

hexcode

class

primary-900

hexcode

Color Neutral

class

neutral-50

hexcode

class

neutral-100

hexcode

class

neutral-200

hexcode

class

neutral-300

hexcode

class

neutral-400

hexcode

class

neutral-500

hexcode

class

neutral-600

hexcode

class

neutral-700

hexcode

class

neutral-800

hexcode

class

neutral-900

hexcode

class

neutral-950

hexcode

class

neutral-white

#FFFFFF

class

neutral-black

#27272A

Color Classes

These are the classes used in the style guide. These will update once you update the variables.

Text Color

class

text-color-primary

class

text-color-secondary

class

text-color-tertiary

class

text-color-alternate

Background Color

class

bg-color-primary

class

bg-color-seconadry

class

bg-color-tertiary

class

bg-color-alternate

Card Color

class

bg-card-primary

class

bg-card-seconadry

class

bg-card-alternate

class

card-outline