Onsite Media — Design System

Style System

The canonical client-first reference for the site. Every page uses these styles and Brand variables for consistent hierarchy, sizing and spacing.

Typography

Display · 5.5rem

The quiet craft of building

Heading 1 · 3.25rem

The quiet craft of building

Heading 2 · 3rem

The quiet craft of building

Heading 3 · 2rem

The quiet craft of building

Body · 1rem

Premium custom homes built with care, from the first drawing to the final detail.

Eyebrow · 13px

Process transparency

Colour

Charcoal Black

#1C1C1C

Charcoal

#333333

Ash

#8A8781

Stone

#B3B0AA

Earthy

#D3CFC7

Bone

#E8E5DE

Paper

#F4F2EE

Spacing & layout

XSmall

0.5rem · 8px

Small

1rem · 16px

Medium

1.5rem · 24px

Large

2.5rem · 40px

XLarge

4rem · 64px

Huge

8rem · 128px

Section Padding

6rem · 96px (top & bottom of each section)

Global Padding

1.25rem · 20px (left & right page edges)

Content Max

1240px (container-xlarge max width)