Teyvat PaletteTeyvat colour cards
Scene library
GitHub
Gallery
Nostoi Region in Hazy Daylight
FontaineDayMistyDistantAqueous

Nostoi Region in Hazy 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%82c4ff46%9edeff66%69a6e7100%58b0dc

Why it works

Depth can be built from two gradients alone: lighter with distance, paler with distance. 99.3% of this frame is one blue family, lightness moves only inside the 21 points between 0.68 and 0.89, and chroma runs from 0.106 at the near water to 0.079 on the far hills while lightness runs 0.72 to 0.87 — not one warm pixel, and the space still holds.

01

Two gradients, running opposite ways

The foreground lake measures L 0.72 / chroma 0.106; the middle-distance cliffs, 0.71 / 0.115; the furthest hills, 0.87 / 0.079. Going back, lightness rises 0.15 while chroma drops 0.027 — one curve up, one curve down, and their crossing is what "far" means. This is the minimum recipe left when aerial perspective is taken apart, and it explains why simply fading a distant plane (dropping chroma alone) looks like a grey veil: only half the job is done, the brightness never followed.

02

Not a single warm pixel in the frame

A 330°–90° warm search across the whole picture finds **nothing** at or above the grey threshold. Blue holds 99.26%; achromatic pixels total 0.10%. Even the patch on the central island that reads as red roof tiles measures L 0.78, chroma 0.086, hue 237° — the same family as the lake, only a little darker. A picture does not need warmth in order to breathe; what it needs is headroom in lightness, and the brightest thing here, at 0.93, is that waterfall, whose chroma falls to 0.041 to give the frame its opening.

03

The same 99% blue can be two different pictures

The Sea of Bygone Eras study is also 99% blue, at a median chroma of 0.153. Here it is 0.097, with a lightness window only 0.21 wide. Neither picture shouts, but they take opposite routes: one pushes chroma high and refuses lightness contrast, the other presses lightness into a narrow window and lets chroma do the grading. A single hue is not a style, it is a house with many rooms — pick the room and the room decides the picture's character.

Take these colours with you

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

/* Nostoi Region in Hazy Daylight · Nostoi Region in Hazy Daylight — Teyvat Palette */
:root {
  --near-water: oklch(0.72 0.106 233); /* Near Water #58b0dc */
  --cliff-blue: oklch(0.71 0.115 251); /* Cliff Blue #69a6e7 */
  --air-blue: oklch(0.8 0.109 247); /* Air Blue #82c4ff */
  --far-ridge-pale: oklch(0.87 0.079 231); /* Far Ridge Pale #9edeff */
  --falls-white: oklch(0.93 0.041 220); /* Falls White #cbeffb */
  --gradient-nostoi-region: linear-gradient(180deg, oklch(0.8 0.109 247) 0%, oklch(0.87 0.079 231) 46%, oklch(0.71 0.115 251) 66%, oklch(0.72 0.106 233) 100%);
}

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