The Creative North Star

A World Grounded in
Artisanal Ritual.

Moving away from the sterile, modular "tech-first" aesthetic to embrace a high-end editorial experience. Tactile, intentional, and deeply rooted in the concept of home.

Color Narrative

The Tonal Palette

Strictly prohibiting 1px solid borders. Boundaries are defined through background color shifts and the natural dialogue between earth tones.

Primary #432A1B
Container #D4C3BB
Container #8e6953
Highest #e3e2df
Accent
#4F4F4F
Accent #7D3C3C
Surface Base
Container Low
Container High

Color & Tonal Narrative

The Heirloom Hearth palette is a dialogue between the earth and the workshop. Rooted in organic tones, it balances tactical warmth with professional precision through high-contrast editorial rhythms.

Primary Collection

The Warm Hearth • #8E6953
Primary Anchor #8E6953
#2D1506
#432A1B
#5F402C
#73513C
#8E6953
#A9846E
#C4A18D
#DEBFAA
#F1D8C9
#FFF5F0

Secondary Collection

Cool Stone • #4F4F4F
Secondary Anchor #4F4F4F
#1B1C1C
#2E2E2E
#474747
#5E5E5E
#757575
#8C8C8C
#A3A3A3
#BDBDBD
#D9D9D9
#F2F2F2

Tertiary Collection

Hand-Fired Clay • #7D3C3C
Tertiary Anchor #7D3C3C
#3A090C
#531D1F
#723334
#884444
#A55C5B
#C17675
#DC918F
#F7ACAA
#FFC7C6
#FFF4F3

Neutral Collection

Pressed Linen • #F6F5F2
Neutral Anchor #F6F5F2
#1B1C1A
#2F312F
#50443E
#82746D
#D4C3BB
#E3E2DF
#E9E8E5
#EFEEEB
#F4F3F0
#FAF9F6

Typography
as Identity

Display Large / Newsreader

The Poetry of Coffee

Headline Medium

Artisanal Roasting from the Heart of the Home.

Body Large / Work Sans

A clean, modern contrast that ensures world-class readability. Our workhorse for narrative storytelling and detailed product descriptions.

Hierarchy Demonstration

Component Standards

Button Language
Input Fields
Signature Story-Block
Favicon for Woodbury Coffee

The Human Touch

Every vessel is hand-thrown, every bean is small-batch roasted. We believe the hand of the maker is visible in every pour.

The Curated Hearth — Search Collection

Depth without Shadows

Tonal Stacking

The Focus Layer

Surface Container Lowest creates a "lifted" effect through color contrast alone.

Insight

Stacking surface tiers creates a soft, natural lift without the noise of a border.

The "Artisanal" Do's

  • Intentional Asymmetry

    Let images bleed off the edge or overlap text blocks to break the grid.

  • Radical Whitespace

    Use generous spacing (8.5rem+) between major editorial sections.

  • Tonal Shifts

    Define boundaries through subtle color blocks rather than structural lines.

The "Editorial" Don'ts

  • 1px Solid Lines

    Never use 100% opaque borders. They create a "template" feel.

  • Pure Black Shadows

    Shadows must be tinted with the background color at very low opacity.

  • Centered Cramming

    Avoid centering large body blocks. Use tension through left-right alignment.