Usage
Color distinguishes our brand and helps us create consistent experiences across products.
React
As a className —.text-{colorCode}.bg-{colorCode}.border-{colorCode}
<h1 className="text-B-500">This text is Brand color</h1>
<h1 className="bg-B-500">This element's background is Brand color</h1>
Stylesheet
As a SCSS mixin —@apply {colorCode}
/* Text */
.example {
@apply text-B-500;
}
/* Background */
.example {
@apply bg-B-500;
}
Color Palette
Color distinguishes our brand and helps us create consistent experiences across products.