Global Typography System

Fixed Scales

System

Fixed Scales (3 Breakpoints)

Desktop

base 18px · scale 1.250

Tablet

base 17px · scale 1.200

Mobile

base 15px · scale 1.125

Steps

8 (4xl · 3xl · 2xl · xl · l · m · s · xs)

Variable

Role

Desktop

Tablet

Phone

Sample

text-4xl

Heading 1

55px

42px

27px

Lorem ipsum dolor sit amet, consectetur adipiscing elit

text-3xl

Heading 2

44px

35px

24px

Lorem ipsum dolor sit amet, consectetur adipiscing elit

text-2xl

Heading 3 · Blockquote

35px

30px

21px

Lorem ipsum dolor sit amet, consectetur adipiscing elit

text-xl

Heading 4 · Subheading

28px

24px

19px

Lorem ipsum dolor sit amet, consectetur adipiscing elit

text-l

Heading 5 · Body Large

22px

20px

17px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis lobortis diam.

text-m

Body

18px

17px

15px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis lobortis diam.

text-s

Body Small · Eyebrow · Fields

14px

13px

12px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis lobortis diam.

text-xs

Heading 6 · Caption · Button

12px

11px

11px

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum venenatis lobortis diam.

Headings

Heading 1

text-4xl:55px • text-4xl-tablet:42px • text-4xl-phone:27px

Playfair Display • Regular • Lineheight:1.25em • Letter Spacing:-.03em

Quiet houses that hold the Marin Light

Subheading

text-xl:28px • text-xl-tablet:24px • text-xl-phone:19px

Playfair Display • Regular Italic • Lineheight:1.25em • Letter Spacing:-.03em

A studio shaping homes with the landscape — coastal light, redwood, stone.

Heading 2

text-3xl:44px • text-3xl-tablet:35px • text-3xl-phone:27px

Playfair Display • Regular • Lineheight:1.25em • Letter Spacing:-.03em

A studio built for fewer, deeper projects.

Heading 3

text-2xl:35px • text-2xl-tablet:30px • text-2xl-phone:21px

Playfair Display • Regular • Lineheight:1.25em • Letter Spacing:-.03em

Homes that reward slow attention.

Heading 4

text-xl:28px • text-xl-tablet:24px • text-xl-phone:19px

Inter • Regular • Lineheight:1.25em

Ten families a year, a decade in.

Heading 5

text-l:22px • text-l-tablet:20px • text-l-phone:17px

Inter • Regular • Lineheight:1.25em

Materials, craft, and the long view

Heading 6

text-xs:12px • text-xs-tablet:11px • text-xs-phone:11px

Inter • Regular • All Caps • Lineheight:1.65em • Letter Spacing:.12em

Selected work · 2014 — 2024

Body Text & UI Elements

Body

text-m:18px • text-m-tablet:17px • text-m-phone:15px

Inter • Regular • All Caps • Lineheight:1.65em • Letter Spacing:.12em

Divi began as two friends working on a single barn in Bolinas. Ten years on, we design homes up and down the coast — but the shape of the work hasn't changed.

Body Small

text-s:14px • text-s-tablet:13px • text-s-phone:12px

Inter • Regular • All Caps • Lineheight:1.65em • Letter Spacing:.12em

We keep the studio small. We visit the site in every season. We sketch by hand, and then we build a model. A Divi project takes two to four years — that length isn't an inefficiency, it's the point.

Body Large

text-l:22px • text-l-tablet:20px • text-l-phone:17px

Inter • Regular • All Caps • Lineheight:1.65em • Letter Spacing:.12em

A house needs time to answer the site, and we want to be there through every season of it. The studio is led by Asha Okafor and Jonas Pellegrini.

Blockquote

text-2xl:35px • text-2xl-tablet:30px • text-2xl-phone:21px

Playfair Display • Regular • Lineheight:1.25em • Letter Spacing:-.03em

"A Divi house feels like it has always been there, and will outlast us all."

Eyebrow

text-s:14px • text-s-tablet:13px • text-s-phone:12px

Inter • Regular • All Caps • Lineheight:1.65em • Letter Spacing:.12em

Divi Interiors · Residential · Est. 2014

Caption

text-xs:12px • text-xs-tablet:11px • text-xs-phone:11px

Inter • Regular • All Caps • Lineheight:1.65em • Letter Spacing:.12em

Western elevation at dusk, October 2023. Photography by Mariko Reed. The Long House, Stinson Beach.

Button

text-xs:12px • text-xs-tablet:11px • text-xs-phone:11px

Inter • Regular • All Caps • Lineheight:1.65em • Letter Spacing:.12em

Fields

text-s:14px • text-s-tablet:13px • text-s-phone:12px

Inter • Regular • All Caps • Lineheight:1.65em • Letter Spacing:.12em

Color Variables

Brand

Primary

Secondary

Semantic

Heading Text

Body Text

Link

Borders

Foundation

white

black

gray-050

gray-100

gray-200

gray-300

gray-400

gray-500

gray-600

gray-700

gray-800

gray-900

gray-950

Example

Example

Example

Example

Example

Example

Example

Example

Example

Example

Example

Example

Divi Interiors · Est. 2014

Quiet houses that hold the Marin light.

A Bay Area studio shaping homes with the landscape — coastal light, redwood, stone, and the patience of long work.

We design fewer houses on purpose. A house needs time to answer the site, and we want to be there through every season of it.

The Long House · Stinson Beach

Current project

Location

Marin County, CA

Program

New construction

Completion

Spring 2025

Location

Marin County, CA

Established

2014

Projects / Yr.

Ten, by invitation

availability

2026 intake