Teyvat PaletteTeyvat colour cards
Scene library
GitHub
Gallery
Ancient Sacred Mountain in Open Sky
NatlanDayLoftyWeightlessEthereal

Ancient Sacred Mountain in Open Sky

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%2d69b516%5292ca47%dcb8a856%da8a9a72%7179ab100%abb7d3

Why it works

When one family takes 86.73%, the quota is down to 0.059 (p99 0.147 minus median 0.088): with no surface willing to go uncoloured, the ceiling of 0.210 passes automatically to the largest surface — the most chromatic blue averages L 0.49 / chroma 0.146, and it is the deepest patch of sky at top right (measured L 0.52 / 0.135), a full 0.19 below the picture's lightness median of 0.71. Meanwhile the subject of the picture, the golden ring on the central island, holds 1,753 pixels in the 15°–90° warm window at chroma 0.047 and a peak of 0.105 — not half the ceiling. Before you try to make a subject out-saturate its surroundings, ask whether the surroundings will give up any area.

01

The most chromatic blue is not the zenith, it is the darkest sky

The most chromatic 3% of 210°–270° (22,908 pixels) measures L 0.49 / chroma 0.146, and the picture's peak of 0.210 lives there; the band of sky along the top of the frame is L 0.64 / 0.107, and the deepest corner at top right is L 0.52 / 0.135. Downward, the sea of cloud that holds the islands up pushes lightness to 0.78–0.84 and chroma back to 0.042–0.085. Within one family, saturation lives at the dark end and the bright end is its pale shadow — which is why the chroma peak and the lightness floor here are the same substance. Keep one corner of sky deep and you need no second hue as an outlet for saturation.

02

The subject never entered the chroma race

A golden ring hangs on the central island: the only made, glowing thing in the frame and where every eye lands first. The rectangle around it measures L 0.78 / chroma 0.056; widen the search and take only the 15°–90° warm pixels and there are 1,753 of them at chroma 0.047, peaking at 0.105 — under half the picture's 0.210. Nor is it the brightest thing: the brightest 1,814 pixels are the bank of cloud to its right (L 0.94 / chroma 0.030, landing at (0.75, 0.49)). Neither brightest nor most chromatic, it leads on position and on a silhouette the cloud cuts out for it. With a quota of only 0.059, a subject cannot buy contrast and has to pay in composition instead.

03

0.059 is the price of never yielding a surface

1.76% achromatic, a chroma median of 0.088 and a p99 of 0.147 — a drop of 0.059. The four pictures in this batch have ceilings of 0.199 / 0.204 / 0.207 / 0.210, a spread of only 0.011, and quotas of 0.125 / 0.051 / 0.100 / 0.059 — a factor of 2.5 apart. Their light differs, their lightness medians fall from 0.71 to 0.34, their achromatic share climbs from 1.18% to 41.61%, and the ceiling does not move. What decides whether a picture reads rich was never how vivid its single most vivid point is; it is whether any surface agrees to keep quiet. The same holds for a single-hue interface — colour the whole screen in one family and the emphasis state can never rise again, unless you first return some large area to neutral.

Take these colours with you

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

/* Ancient Sacred Mountain in Open Sky · Ancient Sacred Mountain in Open Sky — Teyvat Palette */
:root {
  --deep-vault: oklch(0.52 0.135 256); /* Deep Vault #2d69b5 */
  --zenith-blue: oklch(0.64 0.107 247); /* Zenith Blue #5292ca */
  --island-root: oklch(0.59 0.076 276); /* Island Root #7179ab */
  --terracotta: oklch(0.72 0.099 7); /* Terracotta #da8a9a */
  --ring-gold: oklch(0.81 0.047 45); /* Ring Gold #dcb8a8 */
  --cloud-sea: oklch(0.78 0.042 267); /* Cloud Sea #abb7d3 */
  --gradient-ancient-sacred-mountain: linear-gradient(180deg, oklch(0.52 0.135 256) 0%, oklch(0.64 0.107 247) 16%, oklch(0.81 0.047 45) 47%, oklch(0.72 0.099 7) 56%, oklch(0.59 0.076 276) 72%, oklch(0.78 0.042 267) 100%);
}

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