Why does Land Rover use #0c121c instead of a standard near-black?

Land Rover's canvas tone #0c121c is a very dark blue-shifted navy — its OKLCH hue angle sits at approximately 260 degrees (blue-violet), giving it a cold, remote quality that a neutral near-black like #141414 or #191a1d does not have. At screen brightness, the difference is subtle but perceptible: white text on #0c121c reads as cooler and more severe than the same white on a neutral dark. This coldness maps to Land Rover's brand positioning — expedition severity, high-altitude remoteness, professional capability — in a way that a warmer or neutral canvas would not. The JLR sibling Jaguar uses #141414, a fully neutral near-black; Land Rover's #0c121c is a deliberate divergence within the same parent group, expressing a different emotional register through the floor color alone.

What fonts does Land Rover use and what are the open-source substitutes?

Land Rover's system uses two families in strict division of labor. LandRoverWeb-Bold is a custom proprietary display font that appears only on the single display heading (SELECT YOUR MARKET, 38px / weight 700 / 1.9px letter-spacing). AvenirNext handles every other surface: the body paragraph (18px / 400), button labels (10px / 700), form option text (14px / 500–600), micro category labels (10px / 600), and the skip-link accent. The closest open-source substitutes are Montserrat Bold for LandRoverWeb-Bold at the display size (both have comparable cap height and tight geometric proportions); for AvenirNext, DM Sans or Nunito Sans at the same weights transfer cleanly at 14–18px. The wide-tracked button labels (3px at 10px) require explicit letter-spacing applied to any substitute.

How does Land Rover's design system differ from Jaguar's?

Both are JLR group brands and their market-selector pages share significant structural DNA: zero border-radius, white-only text, AvenirNext in the button tier at 10px / 700 / 3px tracking, and three-dropdown form layouts at 45px height. The differences are in the floor and the decorative layer. Land Rover uses a navy-black canvas (#0c121c) versus Jaguar's neutral near-black (#141414) — the blue-shift creates a colder ambient register. Land Rover uses its proprietary LandRoverWeb-Bold for the display heading (38px / 700 / 1.9px tracking) rather than ProximaNova. Most strikingly, Land Rover uses NO background photography on the market-selector page, presenting a completely bare canvas; Jaguar fills its canvas with an abstract violet-blue abstract render. This means Land Rover's system is the more minimal of the two — it strips away even the photographic color voltage that Jaguar retains.

Why does Land Rover use 18px body text on a market-selector form page?

The body paragraph 'If your required market isn't listed please visit our international website' runs at AvenirNext 18px / weight 400 / 24px line-height — a generous size for what is functionally helper text. By comparison, most market-gate utility pages use 14–16px for this kind of secondary copy. The 18px choice positions the sentence as more of an editorial dek than a form footnote, treating the market-selector as an entry point with some hospitality rather than a bureaucratic checkpoint. The typographic generosity is consistent with how Range Rover communicates — it is a brand that values considered presentation even at functional touchpoints. The line-height of 24px (ratio 1.33) gives the text room to breathe against the dark canvas, avoiding the cramped contrast that smaller, tighter type would create at this darkness level.

Where is Land Rover's distinctive heritage green in the web system?

Land Rover's heritage Grasmere Green does not appear in the captured market-selector system. The extraction shows a fully monochrome structural palette — navy-black canvas (#0c121c), slate gray (#4a4f54), white (#ffffff), near-black (#000000), and light gray (#e4e4e4). No green hue appears in any of the 5 clustered colors, and no CSS custom property references a green value. This is consistent with Land Rover's broader digital marketing direction, which uses dark surfaces and product photography rather than brand-color fills. The heritage green appears in vehicle paint options, physical brand materials, and some campaign photography but is not wired into the web system's structural token set. The Defender and Range Rover product pages carry richer palettes than the market-gate, where the green identity emerges through vehicle renders rather than UI chrome.

Land Rover Design System

Land Rover's marketing-site design system as a DESIGN.md file.

About Land Rover DESIGN.md

Curated by Dov AzencotUpdated May 19, 2026Source landrover.com

Automotive

Land Rover's market-selector page is quieter than Jaguar's but no less considered. Where Jaguar fills its canvas with abstract violet-blue photography, Land Rover presents a near-empty dark field: a deep navy-black floor (#0c121c), a bold all-caps display heading in the brand's proprietary LandRoverWeb-Bold font, a short body paragraph, three sharp-cornered dropdowns, a "CONTINUE" button, and the oval Land Rover badge at the bottom left. Nothing else. The system is one of the most reduced market-gate pages in the luxury automotive category — no background image, no product photography, no gradient, no decorative shape.

The DESIGN.md file packages this system for React tooling. Inside: 5 color tokens, all monochrome — the navy-black canvas (#0c121c), slate-gray (#4a4f54) for borders and secondary labels, white (#ffffff) for all text, and a near-black (#000000) for sparse rule elements. LandRoverWeb-Bold carries the single display moment at 38px / weight 700 / 1.9px letter-spacing; AvenirNext runs all other surfaces across six distinct size-and-weight combinations. Every component sits at 0px border-radius. The 18px body paragraph under the heading — unusually generous for a form gate — signals that the brand wants this gatekeeping moment to feel more like an editorial greeting than a bureaucratic redirect.

Feed this file to Claude or Cursor and it reproduces Land Rover's specific stance: navy-black canvas that reads as expedition-dark rather than luxury-neutral, LandRoverWeb-Bold display reserved for a single heading, all UI chrome in monochrome AvenirNext, and zero-radius forms at 45px height. The one move worth isolating: the #0c121c canvas hue is not an arbitrary dark — it carries a blue-green undertone that, against white text and gray borders, creates a colder and more remote atmosphere than a neutral near-black like #141414 achieves. That coldness is the brand positioning made ambient.

What makes it distinct

Navy-black canvas#0c121c is a blue-shifted near-black that reads as expedition-dark rather than the neutral charcoal most automotive brands use
Two-family type splitLandRoverWeb-Bold exclusively for the display heading, AvenirNext for all UI surfaces, navigation, and body
Zero border-radiusevery form element and button uses 0px corners, matching JLR sibling Jaguar and distinguishing both from BMW and Mercedes
Body copy at 18pxthe subhead paragraph runs AvenirNext 18px / weight 400, unusually generous for an automotive form gate
Wide-tracked micro labelsAvenirNext at 10px / 2–3px letter-spacing for navigation and form category labels, the system's primary decorative typographic move

Live at landrover.com

A snapshot of the brand in production. Hover the frame to scroll the page; click to visit.

landrover.com

Explore Land Rover

Pick what you want to see — mockups, colors, typography, layout, or the full component list.

Surface

Page and card backgrounds.

Text

Headlines, body, captions, muted.

Borders & Hairlines

Dividers, outlines, structural rules.

Other

Specialty colors.

Land Rover design system FAQ

Common questions about Land Rover's tokens, components, and how to use this DESIGN.md in your project.

Specs, directories, and component libraries that pair with this design system.

Browse all design systems

The full directory of DESIGN.md files on shadcn.io, with live mockups for each.

Land Rover — official site

Land Rover's public marketing site — the source of truth for the live tokens captured in this file.

The DESIGN.md specification

Google Labs' open spec for machine-readable design system files — the format this page is built on.