Skip to content
Explanation

Why these colours

Tarn's default palette gives colours recurring roles. Blue marks actions such as links and primary buttons. Green marks tutorials as learning material and appears in tip and success messages. Keeping default links blue separates these roles. Neutral slate suits the factual character of reference, while warm ochre marks explanation and its emphasis on reflection.

The light background is a warm cloud-grey, sampled from sunlit clouds over a tarn. The choice expresses Tarn's aim for a quiet reading surface without the brightness of a white page or the cooler tone of a blue-grey.

Dark mode draws on the same lake by night. Its page is a starlit indigo, a deep blue-violet chosen from photographs of tarns under clear mountain skies. The background keeps its colour rather than becoming black, so you stay in the same setting at a different hour. The photographs provided colour inspiration only.

Cool off-white body text suggests starlight, with about 14:1 contrast against the page. The aim is to keep text clear without the sharpness of pure white against a dark ground. Secondary text uses soft lavender greys from the same night palette.

The dark surfaces, links, note boxes and code highlighting are all tuned around the indigo. Links use a brighter sky blue. Green recalls light on water, while ochre and amber draw on the warmth along the horizon in photographs of mountain nights. Inline code uses muted lavender-silver on a quiet chip. Its monospaced font and background distinguish it from prose and links.

The roles describe Tarn's defaults. A project's CSS overrides can change both the palette and its associations. With their standard titles and icons, admonitions identify their type through words and symbols as well as colour. Navigation sections retain their text labels, and badges name the documentation type. The cues in other page content depend on the site's authoring choices.

The stylesheet generator checks selected text/background token pairs against a 4.5:1 contrast threshold in both default schemes. These checks do not establish full accessibility conformance or cover project colour overrides. They test specific colour combinations, rather than every rendered element or interaction.

Design principles places the palette within Tarn's wider approach to reading and navigation. Adjust a colour describes project overrides and checking their contrast.