Design System
Brand Guidelines

Canyon Spirit

Logo usage, colour, type, and voice rules for the Canyon Spirit brand.

This page re-authors the normative rules from the source guidelines, wired to the live tokens below so a token change here is a token change everywhere.

Canyon Spirit Brand Guidelines (7.3 MB)

Canyon SpiritCanyon SpiritOn light — colour
Canyon SpiritCanyon SpiritOn dark — reverse
  • Colour by background — Rustic Orange wordmark on Sand/white/light backgrounds; Sand wordmark on Rustic Orange, Maroon, other dark backgrounds, or photography; Maroon sparingly, and only on Sand/white/light backgrounds.
  • LayoutStacked Centered when the logo is the visual focal point of a composition; Stacked Left when horizontal space is tight; fall back to the primary horizontal lockup if vertical space is tight. Positive on light backgrounds, reverse on Rustic Orange/dark backgrounds (reverse also works over photos).
  • Minimum size — 0.85 in / 70 px for litho/on-screen use; other print methods may need larger.
  • Clearspace — the wordmark's own "A" sets the minimum clearance on all four sides.
  • Don't — recolour/tint, stretch/condense, rotate, outline/drop-shadow, retypeset, remove or add elements, or place on a busy/detailed background.
  • Endorsement lockup — "by Armstrong Collective" centered beneath the wordmark, sized smaller, spaced by its own cap-height, in a recessive tone (40–60%) relative to the logo — brand-team approval required, no self-made versions.
  • The Canyon Spirit Monogram Icon and RTR Route Symbol are part of the logo suite and follow the same colour-by-background usage as the wordmark above.

Colour

--cs-rustic-orange#b25121
--cs-sand#f5ece4
--cs-maroon#67200e
--cs-twilight#0c3945
--cs-sage#787e52
--cs-sky#9daec1
--cs-shadow#000000
--cs-rustic-tint#e0b9a6
--cs-sand-tint#f8f3ed
--cs-maroon-tint#c2a69f
--cs-twilight-tint#9eb0b5
--cs-sage-tint#c9cbba
--cs-sky-tint#d8dfe6
  • Primary — Rustic Orange is the default, most-used colour for logo/copy/backgrounds; Sand is for reversed logos, copy-on-colour, and backgrounds; Maroon is a complementary/balancing colour used after Orange and Sand, or as an Orange substitute (e.g. signage).
  • Secondary — Twilight (sophistication and balance), Sage (evokes nature), and Sky (calming, serene) are background colours; Shadow is neutral and text-only — never a large background field.
  • Pairings — the primary trio together is the default combination. Sand type/logo may sit on any secondary background. Shadow type may sit on Sky, Sage, or Sand. Never pair Rustic Orange with Shadow alone. Digital-only tints exist for subtle variation, used sparingly in the same approved combinations.

Typography

--font-heading: var(--cs-font-display) · --font-body: var(--cs-font-body)

Rocky, Canyon, ArmstrongThe quick brown fox jumps over the lazy dog.

Sampled at Regular: --fs-h1 renders between 36–60px (27–45pt) depending on viewport, which never reaches this brand's own 54pt cutoff for Light (see the size-to-weight rule below).

  • Headline: Ivar Display Condensed (Light/Regular/Medium/Semibold). Body: Founders Grotesk — Regular for body copy, Semibold for subheads/CTAs, Light used selectively for editorial variety, Bold sparingly for emphasis.
  • Fallback when licences are unavailable: Times New Roman (for Ivar) + Aptos (for Founders Grotesk).
  • Size-to-weight rule for headlines — 54pt and above: Light · 32–54pt: Regular · 20–32pt: Medium · 20pt and below: Semibold.
  • Default case is sentence case. ALL CAPS is exception-only (editorial/colour-blocked layouts, support-copy headers) and needs brand-team sign-off.
  • Avoid widows and orphans; optical kerning by default, then manual tracking adjustments by size.

Voice & Tone

Lyrical, Charming, Quietly Bold, Inspirational.

  • Do — be evocative and poetic without turning flowery; write with warmth and conversational charm; make clear, confident statements "with a smile"; stay clear and concise even when expressive; ground imagery in the real Southwest landscape.
  • Don't — be flowery or overwrought; be brash or self-important; hedge with guesses or soft suggestions.
  • Tone scale — slides from Quietly Bold (direct, for CTAs/offers) through Pointed and Expressive (emotional, consideration-stage) to Lyrical (most poetic, for hero/awareness creative like OOH and TV).

On this page