The difference

What proportion feels like.

Same content. Same structure. One side uses arbitrary values — spacing, type sizes, and colors that feel reasonable when you first write them. The other uses Renge's token system, derived from PHI and the Fibonacci sequence. Drag the slider.

Arbitrary: 16px gaps · Georgia · #4a9a6a · line-height 1.5

Renge: PHI-derived spacing · DM Serif Display · OKLCH · φ line-height

Oakland, California — 37.8044° N, 122.2712° W

The living city.

Coast redwood and salt marsh. Oak woodland and tidal estuary. Within the city limits of Oakland, a full spectrum of native plant communities persists — unchanged in type if not in scale from what the Ohlone lived among for 3,000 years.

parks & open spaces

7,700+

acres of open space

plant communities

The landscape

Five places to know.

Oakland sits on a gradient from salt marsh to ridge. In 20 minutes you can walk from tidal estuary to old-growth redwood corridor. Each zone has its own light, its own smell, its own biology.

Forest

Redwood Regional Park

1,619 ft peak

A cathedral of second-growth coast redwoods. The tallest trees in the East Bay canopy reach 150 feet. Streams run cold year-round beneath them.

Woodland

Joaquin Miller Park

960 ft

Named for the poet. Mixed eucalyptus and native oak-bay woodland. Madrone peels its bark every summer like clockwork.

Urban Tidal Lagoon

Lake Merritt

Sea level

A saltwater tidal lagoon at the heart of the city. The oldest official wildlife refuge in North America, designated 1870.

Oakland, California — 37.8044° N, 122.2712° W

The living city.

parks & open spaces

7,700+

acres of open space

plant communities

The landscape

Five places to know.

Oakland sits on a gradient from salt marsh to ridge. In 20 minutes you can walk from tidal estuary to old-growth redwood corridor. Each zone has its own light, its own smell, its own biology.

Forest

Redwood Regional Park

1,619 ft peak

A cathedral of second-growth coast redwoods. The tallest trees in the East Bay canopy reach 150 feet. Streams run cold year-round beneath them.

Woodland

Joaquin Miller Park

960 ft

Named for the poet. Mixed eucalyptus and native oak-bay woodland. Madrone peels its bark every summer like clockwork.

Urban Tidal Lagoon

Lake Merritt

Sea level

A saltwater tidal lagoon at the heart of the city. The oldest official wildlife refuge in North America, designated 1870.

Arbitrary

Renge

Arbitrary

φ⁻¹

φ⁻²

Renge

The specifics

What actually changed.

Many of the values are close. Some are identical. The difference isn't any single number — it's that every number in the Renge system has a reason. Each token is derived from the same mathematical root. That coherence is what you feel before you can articulate it.

Property	Arbitrary	Renge	Why
Space between cards	16px	var(--renge-space-4) = 20px	5 × 4 (Fibonacci × base unit)
Section padding-top	48px	var(--renge-space-7) = 84px	21 × 4 (Fibonacci × base unit)
Card padding	20px	var(--renge-space-4) = 20px	same value, derived from the system
Gap inside card	12px	var(--renge-space-3) = 12px	same value, derived from the system
Eyebrow font-size	11px	var(--renge-font-size-xs) ≈ 12.6px	16px × φ⁻⁰·⁵
Body font-size	14px	var(--renge-font-size-base) = 16px	16px base (φ⁰)
Heading font-size	28px	var(--renge-font-size-2xl) ≈ 67.8px	16px × φ³
Line height (body)	1.5	1.618	φ — the golden ratio
Eyebrow letter-spacing	0.08em	0.12em	tuned to the type system
Card border-radius	8px	var(--renge-radius-3)	from the radius scale
Accent color	#4a9a6a	oklch(…) via profile token	perceptually uniform OKLCH
Display typeface	Georgia, serif	DM Serif Display	chosen for PHI-proportioned letterforms

The arbitrary values are not wrong. A developer who writes gap: 16px and line-height: 1.5 is making reasonable choices. The Renge values aren't dramatically different. They are systematically different. Every step relates to every other step by the same ratio — the ratio that appears in nautilus shells, sunflower spirals, galaxy arms. That relationship produces coherence you feel before you understand it.

1 : 1.618033...