Teyvat PaletteTeyvat colour cards
Scene library
GitHub
Gallery
Belleau Region in Limpid Daylight
FontaineDayLimpidExpansiveFar-seeing

Belleau Region in Limpid Daylight

Palette

Click a swatch to copy its HEX; hover for the OKLCH value.

Reconstructed gradient

The gradient distilled from the scene, unrolled left to right by stop; the authored angle is 180° (used by the hero and exports), while gallery cards share a uniform 135° sweep.

0%449efc20%a9dcff55%84beef76%76bcc2100%2c8eb9

Why it works

To make a picture read clear, don't lower the saturation — lower its area. Belleau's ceiling is not low at all: the sky directly overhead measures chroma 0.163, only 0.012 below the frame's peak of 0.175. But that top step is laid along the upper edge alone, and every other square inch is handed to the cumulus at 0.072 and to the cyan band at 0.073, which covers 10.21% of the frame — so the median chroma stops at 0.093. Same Fontaine, same family of blue, and Liffey's median is 0.121 while the two chroma p99 figures are 0.164 against 0.160: the ceiling is given by the light, the median by the composition.

01

All the intensity sits in one strip along the top

The full strip along the top edge (3% tall) measures L 0.71 / chroma 0.152 / hue 251°; take the middle 40% of the width at 5% tall and it is 0.163, and the frame's peak of 0.175 is here too. Cross 0.05 going down and the cumulus takes over: the bank on the right is L 0.87 / chroma 0.072, the one in the middle 0.84 / 0.083. Even that white aqueduct spanning the frame from edge to edge — the largest man-made thing in the picture — measures L 0.78 / chroma 0.093 / hue 245°, sitting exactly on the frame's median chroma. Peak chroma here is an edge, not a sky. If you want "clear" without "loud", drive the top step out to the very rim of the frame and keep it from spreading across the main field of view.

02

Grass, shallows and sand are one cyan

The slope on the island that reads as green grass measures hue 203° / chroma 0.071; the shallows below it, 208° / 0.076; even that white beach, 213° / 0.076 — three materials less than 10° apart, all inside the 165°–210° cyan band, and that band covers 10.21% of the frame. Search the whole island for green in 90°–165° and it yields 5408 pixels, under 5% of that rectangle. Search the whole frame for warmth in 330°–90° and not a single pixel reaches the grey threshold — there is no warm grain of sand in the picture. What buys the 0.093 median is this broad cyan parked around 0.07. To economise on intensity, first find the largest thing in the frame and keep it at low chroma; desaturating everything evenly will not get it back.

03

Salience is a difference: 0.070 against 0.015

Belleau's zenith is chroma 0.163, standing 0.070 above its own median. Liffey's most saturated stretch of sea is 0.136, standing only 0.015 above its median of 0.121. The two chroma ceilings are nearly identical (p99 0.164 against 0.160), yet the attention they buy differs by almost five times — because how loud a colour reads is that colour minus the median, not the colour itself. Holding the median down is not timidity, it is saving up: the same peak rings one step louder over a floor one step lower.

Take these colours with you

CSS variables, a Tailwind v4 theme or SVG — one click to copy into your project.

/* Belleau Region in Limpid Daylight · Belleau Region in Limpid Daylight — Teyvat Palette */
:root {
  --zenith-blue: oklch(0.69 0.163 252); /* Zenith Blue #449efc */
  --cumulus-blue: oklch(0.87 0.072 239); /* Cumulus Blue #a9dcff */
  --aqueduct-blue: oklch(0.78 0.093 245); /* Aqueduct Blue-Grey #84beef */
  --isle-cyan: oklch(0.75 0.071 203); /* Isle Cyan #76bcc2 */
  --deep-bay: oklch(0.61 0.109 232); /* Deep Bay #2c8eb9 */
  --gradient-belleau-region: linear-gradient(180deg, oklch(0.69 0.163 252) 0%, oklch(0.87 0.072 239) 20%, oklch(0.78 0.093 245) 55%, oklch(0.75 0.071 203) 76%, oklch(0.61 0.109 232) 100%);
}

A 1080×1350 PNG carrying the scene, its palette and every value — save it and post it as is.