Teyvat PaletteTeyvat colour cards
Scene library
GitHub
Gallery
Ochkanatlan, Lowering Sky
NatlanDuskOppressiveVastRuins

Ochkanatlan, Lowering 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%384d7740%536c91100%7b9eca

Why it works

Hang the values upside down: the storm cloud presses overhead at L 0.42 while the sea of mist underfoot is brighter at L 0.69 — we expect a bright sky over a dark ground, and contradicting that expectation is ominous on its own. The oppression here is structural; not one hue had to change.

01

The sky is darker than the ground

The thunderhead measures L 0.42, the mist in the valley L 0.69: the whole value relationship is inverted. In an ordinary landscape lightness falls from sky to ground; here it rises. A heavy top over a light bottom carries oppression and solemnity in its structure alone. Interfaces are no different — a dark page header pressing on light content gets its gravity for free.

02

Inside 88% blue-violet, life is 1.3%

88% of the frame lands in the blue-violet band at 250°–265°. The clifftop green (124°, 0.6%) and the red of cliffs and birds (10°, 0.7%) come to 1.3% between them — and they are everything in the frame that is alive. The recipe for ruin: press the colours of life down to the level of statistical noise, but do not zero them. At zero all that is left is death, and the vastness goes with it.

03

If the hour can't be read, write that down

Light under a lid of storm cloud tells you nothing about the clock; filing this under dusk rests entirely on one low band of brightness at the horizon. Same as Enkanomiya's whitenight: when the light source is not standard, better to write the reasoning into the text than to let a metadata field pretend to certainty.

Take these colours with you

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

/* Ochkanatlan, Lowering Sky · Ochkanatlan, Lowering Sky — Teyvat Palette */
:root {
  --storm-slate: oklch(0.424 0.074 263.1); /* Storm Cloud Black #384d77 */
  --tower-blue: oklch(0.528 0.066 258.3); /* Tower Shadow Blue #536c92 */
  --mist-sea: oklch(0.689 0.077 254.6); /* Mist Sea Blue #7a9eca */
  --mesa-green: oklch(0.831 0.072 123.7); /* Clifftop Green #bed09c */
  --scarlet-wing: oklch(0.664 0.059 9.6); /* Crimson Wing #b4858b */
  --gradient-ochkanatlan: linear-gradient(180deg, oklch(0.424 0.074 263) 0%, oklch(0.528 0.066 258) 40%, oklch(0.689 0.077 255) 100%);
}

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