The docs are still under development and we’re adding more content.


The global color palette of a block theme is set via theme.json. We use the same set of color names in all our themes. This approach makes it very easy for you to switch between our themes. The export and import of color palettes will also be possible, once this feature is available in Styles.

The global color palette we use in all our themes:

Background Primary
Background Secondary
Background Tertiary
Background Quartenary
Background Quinary
Text Primary
Text Secondary
Text Tertiary
Text on Brand
Border Primary
Border Secondary
Brand Primary
Brand Secondary
Brand Tertiary
Accent Primary
Accent Secondary
Accent Tertiary

Variant Background Primary
Variant Background Secondary
Variant Background Tertiary
Variant Background Quartenary
Variant Background Quinary
Variant Text Primary
Variant Text Secondary
Variant Text Tertiary
Variant Text on Brand
Variant Border Primary
Variant Border Secondary
Variant Brand Primary
Variant Brand Secondary
Variant Brand Tertiary
Variant Accent Primary
Variant Accent Secondary
Variant Accent Tertiary

Customizing the color palette


Adding a custom color palette


Apply colors in blocks


Use a custom color in a block