Color palette, typography, tokens, and application guidelines for the Dwell Contemporary brand. Use these specifications consistently across all digital and print materials.
Version
1.0 · Oct 2026
Prepared by
Swift Innovation
Primary fonts
Spectral Raleway · Lato
01 -Color
Core Palette
Six colors drawn from wood and stone. Walnut and Cedar are both true wood tones - dark aged walnut and warm natural cedar. Gold is burnished brass hardware. Field Stone, Quarry, and Mist are the stone register - warm fieldstone, cut quarry stone, and whitewashed plaster.
Walnut
Brand Primary
#2D2520
RGB 45 · 37 · 32
CMYK 0 · 18 · 29 · 82
Dark surfaces, primary text on light backgrounds, navbars, footer fills. The near-black of aged walnut and ebony-stained cedar.
Cedar
Brand Wood
#9A7150
RGB 154 · 113 · 80
CMYK 0 · 27 · 48 · 40
Hero headlines, brand accents, large display type. The warm brown of natural cedar sauna benches and unfinished pine racking.
Gold
UI Accent
#D4AA3A
RGB 196 · 154 · 60
CMYK 0 · 21 · 69 · 23
CTAs, eyebrow labels, active states, link hover, and decorative rule lines. Burnished brass - the hardware and metalwork of a finished wine cellar.
Mist
Base Background
#EDEBE8
RGB 237 · 235 · 232
CMYK 0 · 1 · 2 · 7
Primary page background, card fills on dark surfaces, reversed text on Walnut or Field Stone. Cool off-white - whitewashed stone, not warm cream.
Quarry
Alt Surface
#D3D0CB
RGB 211 · 208 · 203
CMYK 0 · 1 · 4 · 17
Section band backgrounds, table stripes, subtle containers. Cool grey stone - polished concrete, cut limestone, quarried slate tile.
Field Stone
Mid Neutral
#7A7468
RGB 122 · 116 · 104
CMYK 0 · 5 · 15 · 52
Secondary body text, muted labels, icon fills, and borders. The warm grey-brown of the wine cellar stone walls.
02 -Tint & Shade Ramps
10-Step Scale
Each core color has a 10-step tint-to-shade ramp. Steps 50–400 are tints (lightened). The base value appears at 500 or the step nearest to it. Steps 600–900 are shades.
Walnut
Primary dark - aged walnut, ebony-stained cedar
Base: #2D2520 (700)
50#F0EDEA
100#D9D0C8
200#B8A898
300#978068
400#70594A
500#4E3C30
600#3A2D24
700#2D2520
800#1E1915
900#100E0C
Cedar
Brand wood - natural cedar and unfinished pine
Base: #9A7150 (500)
50#F5EFE8
100#E4D4C0
200#CDAF8A
300#B79268
400#AA7F58
500#9A7150
600#7A5940
700#5A4230
800#3C2C20
900#1E1610
Gold
UI accent & highlight
Base: #D4AA3A (400)
50#FBF5E6
100#F3E4B4
200#E8CC7A
300#D9B048
400#D4AA3A
500#A8822D
600#876820
700#654E17
800#43330E
900#221A07
03 -Tokens
Semantic Color Tokens
Map purpose-named tokens to core palette values. Use token names in all code -never hardcode hex values. This allows future theme changes without touching component code.
Backgrounds
--bg-page
Mist · #EDEBE8
--bg-band
Quarry · #D3D0CB
--bg-dark
Walnut · #2D2520
--bg-card
White · #FFFFFF
Text
--text-primary
Walnut · #2D2520
--text-warm
Field Stone · #7A7468
--text-muted
Stone · #9A8070
--text-on-dark
Mist · #EDEBE8
Brand & Accent
--accent
Gold · #D4AA3A
--brand
Cedar · #9A7150
--neutral
Field Stone · #7A7468
--accent-dim
Gold 50 · #FBF5E6
Borders & Dividers
--border-default
Warm sand · #DDD4C5
--border-strong
Stone med · #C8BDAE
--border-subtle
Quarry · #D3D0CB
--border-accent
Gold · #D4AA3A
04 -Accessibility
WCAG 2.1 Contrast Matrix
All foreground/background combinations must pass AA minimum (4.5:1 for body text, 3:1 for large text and UI). Preferred combinations are marked AAA.
Walnut on Mist - 12.8:1
Use for all body copy and primary text. Exceeds AAA. The default pairing for every page.
Mist on Walnut - 12.8:1
Reversed pairing for dark-surface hero sections, navbars, and footers. Exceeds AAA.
Walnut on Quarry - 9.8:1
Use for secondary sections and band backgrounds. Exceeds AAA.
Gold on Walnut - 5.8:1
Use for accent text, eyebrows, and labels on dark backgrounds. Passes AA. Avoid for small body text below 16px.
Field Stone on Mist - 3.9:1
Passes AA for large text (18pt+) and UI components only. Do not use for small body copy. Cedar (#9A7150) on Mist is 3.7:1 - large display and decorative type only, never body copy.
Foreground
Mist
Quarry
Walnut
Field Stone
Walnut
12.8AAA
9.8AAA
n/a
2.2Fail
Mist
n/a
1.3Fail
12.8AAA
3.9AA-LG
Gold
2.5Fail
2.0Fail
5.8AA
2.0Fail
Field Stone
3.9AA-LG
3.0AA-LG
2.2Fail
n/a
AA-LG = passes AA for large text (>18pt) and UI elements only · Cedar (#9A7150) is display-only, fails AA for body text on light surfaces
05 - Application
Usage Examples
Common UI patterns shown in each of the three surface variants: Walnut dark, Mist light, and Quarry stone-neutral.
Walnut Surface
Wine Cellars
Curated by hand, built to last.
From glass wine walls to traditional cellar rooms, Dwell Contemporary delivers turnkey custom storage that reflects your collection and your home.
Mist Surface
About Dwell
Family owned. Personally delivered.
John Koziol founded Dwell Contemporary on a philosophy of hands-on craftsmanship and direct client care. Over 30 years, one project at a time.
Quarry Surface
Always Complimentary
Start with a conversation.
Initial consultation, site assessment, and budget review -all on us. We take the time to understand your vision before we recommend a single racking solution.
No pressure. No obligation.
Call 715.602.9909 or fill out a quick form to get started.
06 -Typography
Type System
Three-font system: Spectral leads editorial and brand moments - a classical old-style serif with historical proportions closer to Fournier than Playfair. Raleway (the logo font) carries UI chrome, labels, and navigation. Lato handles body copy.
Display · Headings · Brand
designed to dwell
Spectral
Google Fonts · playfair-display
Hero headlines, section titles, pull quotes, testimonials, and any moment where brand voice leads. Classical old-style proportions with optical axis variation - closer to Fournier and Garamond than to display-first serifs like Playfair.
Hero
Aa
H1
Aa · 40px / 700
H2
Section Title · 28px / 700
H3
Card Headline · 22px / 400
Quote
"Built to reflect who you are." · 18px italic
UI · Navigation · Labels · Logo
DWELL
Raleway
Google Fonts · raleway · brand logo font
Navigation, eyebrow labels, buttons, sub-headings, and all UI chrome. Raleway is the font used in the Dwell Contemporary logo wordmark - thin geometric, uppercase, wide tracking. Use 200-300 weight for large display, 600-700 for buttons and labels.
Logo
dwell Contemporary
Sub-H2
Wine Cellars · Saunas
Label
WINE CELLARS · 11px / 700
Nav
OUR WORK
Button
EXPLORE WINE CELLARS
Body · Copy · Captions
Lato
Lato
Google Fonts · lato
Body copy, descriptive paragraphs, form fields, captions, and long-form content. Lato's warm geometric curves keep body text comfortable at 15-16px while complementing Spectral's editorial presence above it.
Large
Body Large · 18px / 400
Body
Body Default · 16px / 400
Small
Caption · 14px / 400
Light
Intro lede copy · 16px / 300 italic
Strong
Emphasis inline · 15px / 700
07 -Voice & Tone
Copy Principles
Dwell Contemporary's voice is warm and expert -never salesy or technical. John speaks to clients as peers who share a love of exceptional spaces.
Craft-forward
Lead with what the outcome feels like -a cellar that changes how guests experience your home. Follow with how we make it happen.
Direct and confident
Say "We build your vision" not "We help you achieve your goals." Concrete verbs. Short sentences. Active voice throughout.
Personal, not corporate
This is family-owned. Use "we" and "you." Avoid generic service language. Reference real materials -teak, glass, anodized aluminum.
Avoid
Industry jargon, HVAC acronyms without context, passive voice, filler phrases like "world-class" or "cutting-edge," and price qualifiers without specifics.
Never
Claim things Dwell cannot verify -delivery timelines without confirming scope, universal coverage when service area is Midwest, superlatives without proof.
Tagline
"designed to dwell" -lowercase, no period. This is a lifestyle statement, not a product description. Use sparingly as brand punctuation.
08 -Iconography
Icon System
Lucide Icons is the standard icon library. Strict 1.5px stroke weight, 24px base grid, consistent geometric construction. Icons communicate function - always pair with a text label at small sizes, never use as decoration alone.