Style guide
The Corbel system.
Colour styles, text styles and the components every page is built from. Change a style here and it updates across the site.
Start here
Make Corbel yours.
Six things to set before you publish. Everything else follows from the styles and components on this page.
01
Colours
Edit the colour styles in Assets. Every page follows, in light and dark mode.
02
Type
Marcellus, Albert Sans and IBM Plex Mono are set as text styles with desktop, tablet and phone sizes.
03
Header and footer
Open the Main layout template, select the header or footer and pick one of the variants shown below.
04
Projects, team, journal
These are CMS collections. Add an item and its page, card and filters update on their own.
05
Forms
Contact, viewing, investor and newsletter forms: set Send to on each form before you publish.
06
Loader and cookies
The page loader and cookie banner live in the layout template. Switch either off there.
Colour
Brand and neutrals
Brand / Dark
Wada Slate Color · #34454C
Brand / On Dark
Wada Sulpher Yellow · #F5ECC2
Brand / Accent
Wada Ochraceous Salmon · #D8A37B
Brand / Accent Deep
Wada Pale Raw Umber · #71502F
Neutral / Paper
#F5F4F1
Neutral / Paper 2
#EBEAE6
Neutral / Ink
#121416
Neutral / Ink 2
#55585C
Type
Marcellus, Albert Sans, IBM Plex Mono
Display XL
96 / 72 / 46 · Marcellus
Homes built for the next fifty years.
Display L
60 / 48 / 36 · Marcellus
Places we have built
Display M
44 / 36 / 28 · Marcellus
We replace tired blocks with homes people stay in.
Heading
30 / 28 / 24 · Marcellus
Reading a floor plan before you buy
Title
22 / 22 / 20 · Marcellus
Materials first
Body L
18 / 17 / 16 · Albert Sans
Corbel develops residential, mixed-use and hospitality projects.
Body
16 / 16 / 15 · Albert Sans
Every renewal plan starts with the residents who already live there.
Small
14 · Albert Sans
Open Monday to Saturday, 10:00 to 18:00.
Label
11.5 · IBM Plex Mono, 0.14em
Selected projects
Components
Buttons, labels and cards
Dim label · light
Dim label · accent
How long does a renewal project take?
Most projects take three to four years from the residents’ vote to the day families move back in. Construction itself usually takes 24 to 30 months.
Can I visit a home before it is built?
Headers
Five headers, one component.
Pick a variant on the header in the Main layout template. Each variant has its own phone menu; hover Pages for the full page index.
01 · Classic
Default
02 · Split
03 · Paper
04 · Minimal
05 · Announce
Bars
Three bars for news and notices.
Place a bar above the header or pin the floating one to the bottom of a page. Message, tag and link are properties.
01 · Announcement
02 · Dismissible
Close hides it
03 · Floating
Pin to the bottom
Footers
Five footers, one component.
Choose the footer variant in the Main layout template. The cookie banner property switches the cookie notice on or off.
01 · Columns
Default
02 · Wordmark
03 · CTA
04 · Minimal
05 · Centered