> This page is for Docs.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://zuora.ferndocs.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://zuora.ferndocs.com/_mcp/server.

# Style tokens in Experience Builder

> Style tokens in Experience Builder are reusable, named values that centralize design properties like color, typography, and spacing so you can maintain consistent styling and easily update branding across your application.

Style tokens in Experience Builder are reusable, named values that centralize design properties like color, typography, and spacing so you can maintain consistent styling and easily update branding across your application.

Style tokens are reusable, named values that help you maintain consistent styling across your application. Instead of defining individual style values such as colors, font sizes, or spacing in multiple places, you define them once and reuse them throughout your project.

When you update a token, all components that reference that token automatically reflect the change.

## Benefits of style tokens

Use style tokens to:

* Maintain consistent styling across pages and components
* Centralize design values such as colors, typography, and spacing
* Simplify branding and theme updates
* Reduce repetitive styling
* Support scalable design systems

## Supported token types

You can create tokens for the following style properties:

* Colors
* Font size
* Font family
* Line height
* Opacity
* Spacing, including margins, padding, width, and height

You can also create tokens that reference other tokens. This lets you build semantic tokens on top of foundational design values.

You can create a style token from the [Design panel](/docs/platform/extensibility/experience-builder/style-tokens-in-experience-builder/create-a-style-token-from-design-panel) or from the [Style Tokens panel](/docs/platform/extensibility/experience-builder/style-tokens-in-experience-builder/create-a-style-token-from-style-tokens-panel).