Design your site

Design controls how your entire club site looks - every page, the header and footer, every widget - from one place. The preview beside the sidebar is your real site, updating live.

Colours: presets first, then tweak

Two modes in the Colours section:

• Theme - ready-made palettes. Applying one sets all your colours to a combination that works together; fonts and style options stay put.
• Custom - every individual colour, grouped: brand, buttons, page background, text, links, borders, header and footer. The intended flow is pick a preset, then tweak. Click a colour's swatch to open the picker, and reuse a colour you've already used from the Used in this theme row underneath it.

Buttons

Buttons have their own section, separate from your accent colour - so you can run a red club colour with black buttons if that's the look.

• Button Background - the fill on your buttons
• Button Text - the label colour on top of that fill. Go dark if your buttons are a bright colour like yellow

Hovering a button darkens it slightly. That happens automatically from the colour you picked, so there's nothing to set.

Buttons come in three styles, chosen per button in the page builder: solid fills with your button colour, outline uses it for the border and label, and ghost is the label only. Buttons over a hero photo stay white so they can still be read against the image.

Text and accents

Under Text: Headings, Body Text, Subtle Text (dates, captions) and Links.

Your Accent Colour is the club colour that runs through the smaller details - event dates, icons, dividers, number badges - with Text on Accent for anything sitting on top of an accent fill. Changing your accent doesn't move your buttons, and changing your buttons doesn't move your accent.

Header and footer colours live here (not in the Header & Footer editor), so the whole site changes together.

Your Headings colour applies everywhere except over a background image. Hero and banner titles sitting on a photo or video use white by default, since the overlay darkens the image beneath them. To hand your Design colours back on one of those widgets, set Text Colour to Theme in its Style tab - and if the photo then makes the heading hard to read, turn up Overlay Style / Overlay Strength to darken it further.

Fonts

Pick a heading font and body font from the curated list, or upload your own under Custom Fonts - up to 3 files (WOFF2, WOFF, TTF or OTF, 3MB each). Uploaded fonts appear in the same dropdowns and don't count against your media storage.

Style

Three site-wide switches:

• Corner Style - sharp, soft or rounded corners on every card, button and image frame.
• Show Borders - the thin dividing lines around cards and sections, on or off.
• Typography - uppercase headings on/off, underlined links on/off.

Saving

Design previews changes live, but nothing hits your public site until you Save. Custom font uploads are the exception - they save as soon as they upload.