Site themes, colors, and typography

Documentation / Design and styling

Site fonts and theme colors establish a shared visual foundation. Native controls can then apply the appropriate role to a page or block without embedding presentation code into its text.

Select site fonts

Open Settings > Design > Fonts. The font selectors include Body Font, Heading Font, and the optional Accent font. Search for a family, select it, review the sample, and save through the page's save control.

An unset accent font uses the body font. For native text, Design settings > Font role offers Automatic, Body, Heading, or Accent. Use the accent role for a limited purpose rather than changing the structural meaning of a heading.

For custom CSS, naming a font family does not load it. Choose the family through site font settings and use the provided font variables where appropriate.

Website and page colors

The Website theme dialog edits the website-wide theme. Saving it writes a site-level change. Page colors is narrower: enable Override website colors, adjust the palette, and apply it to the page's editing state. Save the page to publish that override.

Page colors apply to the page and its translations. Theme-aware Buttons follow the effective website theme or page override. A page override is therefore not an independent color choice for each translated version.

Review actual combinations

Inspect headings, paragraphs, Buttons, cards, and media overlays after saving. A palette can produce different contrast on light and dark surfaces. Check long translated text and mobile wrapping after a font change.

Do not infer that every part of shared navigation follows page colors; shared chrome has its own rendering rules. See Templates and reusable content for shared presentation.