
Switch with one setting
Five styles
Each style sets fonts, shapes, colours and component details. A client's brand colours sit on top.
page-header — copy these settings
- background_image: images/demo/lion.jpg
divider_bottom: curve
eyebrow: Switch with one setting
heading: Five styles
overlay: primary
subheading: Each style sets fonts, shapes, colours and component details. A client's brand colours sit on top.
type: page-headerHow to switch
In a site’s data/brand.yaml, set style: to summit, coastal, heritage, studio or hearth. Add colors: and fonts: only if the client needs their own brand colours or fonts. Everything else comes from the style.
On this showcase, use the Style switcher at the bottom left to see every page in every style.
text — copy these settings
- body: |-
In a site's `data/brand.yaml`, set `style:` to `summit`, `coastal`, `heritage`, `studio` or `hearth`. Add `colors:` and `fonts:` only if the client needs their own brand colours or fonts. Everything else comes from the style.
On this showcase, use the **Style** switcher at the bottom left to see every page in every style.
heading: How to switch
type: textSummit
Bold condensed caps, navy and gold, angled edges. Causes, books, trades, sports.
Coastal
Airy and rounded, pill buttons, teal and sand. Health, wellness, services, real estate.
Heritage
Serif and editorial, parchment, burgundy and gold. Law, churches, hospitality, finance.
Studio
Oversized grotesk, near-black and lime, outlines and grid lines. Agencies, tech, events.
Hearth
Warm and friendly, rounded, orange and teal, chunky buttons. Restaurants, family business, community.
cards — copy these settings
- background: muted
columns: 5
items:
- icon: bolt
text: Bold condensed caps, navy and gold, angled edges. Causes, books, trades, sports.
title: Summit
- icon: world
text: Airy and rounded, pill buttons, teal and sand. Health, wellness, services, real estate.
title: Coastal
- icon: bookmark
text: Serif and editorial, parchment, burgundy and gold. Law, churches, hospitality, finance.
title: Heritage
- icon: paint-bucket
text: Oversized grotesk, near-black and lime, outlines and grid lines. Agencies, tech, events.
title: Studio
- icon: happy
text: Warm and friendly, rounded, orange and teal, chunky buttons. Restaurants, family business, community.
title: Hearth
type: cards