Appearance and theme

Where: Setup → Appearance

Colours, fonts, spacing and button styles for your public event site. A live preview sits beside the controls, so you can see the effect of every change before saving.

You do not need to touch most of this. Setting your theme colours and font gets you 90% of the way to a site that looks like yours. The rest exists for when you are matching an established brand precisely.

The live preview

The Event live preview panel shows your actual site with your current settings applied. It updates as you change things, before you save.

Use it. Colour choices that look fine in a swatch often fail on a real page.

Theme Colors

Your primary brand colours — the ones used for buttons, links, highlights and accents.

If you have brand guidelines, this is where their hex values go. If you do not, pick one strong colour and let the platform derive the rest.

Contrast is checked for you

The colour controls warn you when a combination is too low-contrast to read. Take those warnings seriously — they are the difference between a site that works for everyone and one that a meaningful fraction of your participants cannot read.

Surface Colors

The background colours behind your content — page backgrounds, cards, panels.

Small changes go a long way. A surface colour far from white or near-black makes text harder to read on every page at once.

Font

The typeface used across the site.

One font choice applies everywhere. Pick something legible at small sizes; leaderboards and tables are dense.

Font Sizes, Font Weights

Fine control over the type scale — how big headings are relative to body text, and how bold.

Adjust these only if the defaults clash with your brand. They are set to a scale that works across screen sizes, and changing one value can cascade oddly on mobile.

Spacing, Border Radius, Border Widths, Radii, Effects

The geometry and finish of the interface: how much air between elements, how round the corners, how heavy the borders, and whether elements carry shadows.

These are what you use to match an existing brand exactly — sharp corners and hard edges versus soft and rounded. Purely visual; nothing here changes behaviour.

Form Styling

How input fields on the registration form look — borders, backgrounds, focus states.

Worth a look before launch, since the registration form is the page that matters most commercially. Check that focused fields are obviously focused.

Hero CTAs

The call-to-action buttons on your homepage hero — the banner at the top of the site.

For each button you control the Label, where it goes (Page, Custom URL or a system action such as register or donate), its Style, and which event modes it is visible in.

This is the most commercially significant part of this screen. The hero button is what most visitors click. Make its label say what happens: "Register now" beats "Learn more" when registration is what you want.

Header

The site header: Logo position, whether it is Sticky on scroll, whether it is Transparent over hero, its Max width, the Navigation menu, the Profile dropdown, and an optional Promo bar.

The promo bar is the strip above the header — use it for a deadline or an announcement, and turn it off when it is no longer true. A stale promo bar advertising a passed deadline is worse than none.

E-Bib and Email Background

E-Bib styles digital race bibs. Email Background sets the backdrop for your outgoing email — see Communications.

Resetting

Every card has a Reset to default control, and there is a full reset for the whole screen.

If you have experimented into a mess, reset and start from the defaults. They are a competent starting point.

Related

• Branding and images — the images this theme wraps
• Website and pages — the content inside the theme