Skip to main content
Defines all the colors in the theme. To fully change the theme, you only need to define the SemanticColors, and the rest of the values will inherit from them. For more granular control, individual ComponentColors can be overridden. For example, the colors-bg-primary semantic color is used to define the background color for a “primary” variant component. The colors-cta-primary-bg-default component color inherits from the colors-bg-primary semantic color via CSS variables. If you want to override the just the default background color of the primary cta, you can do so by defining the colors-cta-primary-bg-default token in the theme.

​
Example