101
Sun-bleached concrete, asphalt dark, and highway-yellow centerline — the colours of Highway 101, the Pacific Coast Highway. The boldest light theme in the collection: road-signage energy for transportation, logistics, mapping, and bold consumer products.
Version 1.0.0Meet 101
A look at its colors and typography, from the headline to the smallest details.
A place for your next chapter.
Your ideas, your stories, your point of view. Give them a home that feels like you.
Thoughtful type, a clear palette, and space for what matters.
A place for your next chapter.
Your ideas, your stories, your point of view. Give them a home that feels like you.
Thoughtful type, a clear palette, and space for what matters.
The identity
A character of its own
101 is a wayfinding system in theme form: sun-bleached concrete canvas, asphalt-dark text, and a single highway-yellow accent that behaves exactly like a road centerline — the one colour that demands attention and never apologises. Geometric Helvetica headings read like carved road signs; near-flat radii and tight structural shadows keep every surface pressed and precise. Signage energy comes from catalogued treatments — capsule waypoints, milestone steps, rule-topped panels — not from decorative chrome.
- bold
- geometric
- signage-clear
- unapologetic
The palette
Color with intention
Light palette
#f9f7f2#1c1c1c#e8b020#f5e8b0#f0ede5Dark palette
#141311#f2efe8#f0bd3a#3a3016#211f1cThe typography
Find your voice in type
Headings
Make a little room for possibility.
"Helvetica Neue", Helvetica, Arial, sans-serifBody
Good stories start with a clear point of view.
-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serifCode & details
Aa Bb Cc · 0123456789
"SFMono-Regular", Menlo, Consolas, monospaceMade for
Who it speaks to
Transportation, logistics, mapping and navigation products, developer platforms with attitude, and bold consumer apps — Californian and otherwise — that would rather polarise than blend in. Typical owners: a fleet-tracking dashboard, a routing/maps API team publishing docs, a delivery-logistics startup's marketing site, a mobility app that wants its brand to feel like open-road momentum.
The voice
How it sounds
Direct, confident, and unhurried — the register of good road signage. Say the thing in the fewest words, lead with the useful part, and let the yellow (and the whitespace) carry the emphasis. Confident is not loud: skip hype adjectives, keep one clear call to action per view, and trust the reader to keep moving.
Art direction
The thinking behind the look
Sun-bleached concrete (#f9f7f2) canvas with asphalt-dark (#1c1c1c) text and one highway-yellow (#e8b020) accent reserved for decisive moments: primary buttons, focus rings, active waypoint pills, and the rule-topped panels that recur across the system. Links use a legible dark amber (#8f5a00), NOT the yellow — the yellow is a signal, not body text. Helvetica Neue / Arial geometric headings (a stand-in for FHWA Highway Gothic) over a system-sans body, near-flat radii (2px sm, 4px md) because roads and signs have no rounded corners, tight structural shadows (1-4px), and 5rem section rhythm like the distance between exits. In dark mode the road at night: warm asphalt near-black (#141311), concrete-cream text (#f2efe8), and headlight/centerline yellow lifted to #f0bd3a so it still reads on the dark surface.