Themes

A theme sets how custom pages look: colours, fonts, spacing, rounded corners and shadows, plus an optional branded header and a fallback cover image. You assign a theme to a page space, and every page in that space uses it.

Open Administration → Themes, under Pages. You need the Manage page themes and design tokens permission, and your plan must include Custom Pages.

The themes list

Each row shows the theme's Name, its primary, secondary and accent Colors, its Fonts ("H:" for headings, "B:" for body text, or System Default), whether it is the Default theme, and who created it. Use Search themes… to filter the list.

Each row's menu offers Edit, Set as Default and Delete.

Create or edit a theme

1. Click New Theme, or choose Edit on an existing theme.
2. Enter a Theme Name, for example Nordic Light.
3. Adjust the settings on each tab, described below.
4. Click Create Theme, or Save Changes.

Changes apply to every page in the spaces that use the theme the next time the page is opened.

Colors

Six colours, each entered as a hex code such as #1A73E8:

Colour	Used for
Primary	Main brand colour for buttons and links.
Secondary	Supporting colour for accents.
Accent	Highlights and calls to action.
Background	The page background.
Surface	Cards and panels on top of the background.
Text	Body text.

Check that Text stays readable on both Background and Surface.

Typography

• Heading Font and Body Font: pick any Google Font. Font Preview shows a sample.
• Heading Sizes: the size, weight and line height of headings H1 to H4. Sizes use px, rem or em, for example 2.5rem.

Spacing

Base Unit (px), from 1 to 32, sets the rhythm of margins and gaps. Spacing Scale Preview shows the resulting sizes.

Effects

• Border Radius: how rounded corners are, in four sizes from small to extra large.
• Box Shadows: small, medium and large shadows used on raised elements.

Branded header

Turn on Show header with branding to show your brand logo above each page's cover image. Add an optional Header title next to it.

The option is only available once a logo is uploaded under Branding.

Default cover image

A Default Cover Image is used on pages that don't set their own cover, in every space that uses the theme.

1. Save the theme first. The option only appears when editing an existing theme.
2. Click Upload, and choose an image of up to 10 MB.
3. To change it later, click Replace Cover Image.

Apply a theme

Themes are applied through page spaces:

1. Open Administration → Page Spaces.
2. Choose Edit on a space, or create a new space.
3. Choose the theme under Theme, then save.

Every page in the space, including collection pages in the Collections space, now uses the theme. See Page Spaces.

The default theme

Set as Default marks one theme as the workspace default, shown with a star. Only one theme can be default at a time.

When you create a space, the default theme is already selected under Theme. You can pick another theme, or No theme, before saving. Changing the default later does not change the theme of existing spaces.

Delete a theme

Choose Delete in the theme's row menu and confirm. Two kinds of theme cannot be deleted:

• The default theme. Its Delete option is disabled. Set another theme as default first.
• A theme used by a space. The delete dialog says how many spaces use the theme, and its Delete button is disabled. Choose another theme for those spaces in Page Spaces first.

Troubleshooting

"Cannot delete the default theme." or "Cannot delete theme that is in use by page spaces."

The theme is still the default, or a space still uses it, for example because a colleague assigned it while your list was open. Set another theme as default, or change the theme of the spaces that use it, then delete again.

"Color must be a valid hex color code (e.g., #000000 or #000)."

Enter the colour as a hex code starting with #, with 3 or 6 characters. Colour names such as blue are not accepted.

The branded header option is greyed out

Upload a brand logo in Branding, then reopen the theme.

A page doesn't use my theme

Check which theme its space uses in Page Spaces. A theme only applies to pages through their space.

Related pages

• Page Spaces: assigning themes to spaces.
• Custom Pages: building pages and choosing their cover images.
• Branding: your logo and brand colours.