Start with a preset
Theme Preset offers seven complete looks:
Choosing a preset replaces the entire theme rather than merging with your current settings —
accent, radius, shadows, spacing, typography, light/dark, and any custom colors you had entered.
So pick the preset first and adjust afterwards. Once you change anything by hand the dropdown reads
“Custom / No Preset”, which is normal and not an error state.
The individual controls
Custom Colors (Optional) goes underneath, with seven slots you can override individually:
Background, Surface, Surface Accent, Border, Text Primary, Text Secondary, and Text on Accent. They
take six-digit hex values only (
#1A2B3C); a shorthand like #ABC will not be accepted. Each slot
has a clear control to hand the color back to the theme.
Switching Appearance clears your custom colors. Toggling between Light and Dark discards
everything in the Custom Colors block so the light or dark defaults can take over. Decide light or
dark before you hand-pick colors, not after.
Page width and padding
The Layout group sets the container the whole page renders in:- Max Width — SM through 2XL, or Full Width. Pages are almost always read on a phone, so this mostly governs what happens on a desktop browser: a narrow max width keeps the page looking like a phone screen, Full Width lets it stretch.
- Padding — the space between the page content and the edge of the screen, from None up to 12.
Reading theme values in a binding
Two theme values are readable as bindings inside the page:{{theme.accent}} and
{{theme.radius}}. They return the token name rather than a color or a pixel value — sky,
xl — so they are useful in a Custom Styles expression that needs to follow the theme, and not
useful as a color you can display.
The rest of the theme is not exposed as bindings.
What the theme does not cover
- There is no logo or brand image setting in the theme. Put a logo on the page as an ImageSection or in a TubInfo section instead.
- There is no per-Item theme by design, but an Item override can carry one. When it does, the Item stores the entire theme rather than the one value you changed — so later changes to the Collection’s theme will not reach that Item at all. See Per-Item Page Overrides.
- Custom Styles on individual sections are a separate mechanism from theming, set per section in the Properties panel, and they override whatever the theme decides.