Teyvat PaletteTeyvat colour cards
Scene library
GitHub
Gallery
Lempo Isle, a Lamplit Corner
Nod-KraiDimCrampedLived-in

Lempo Isle, a Lamplit Corner

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 90° (used by the hero and exports), while gallery cards share a uniform 135° sweep.

0%181b1e35%493b5b70%5a3337100%b3988b

Why it works

Take the sky away and what a picture loses is chroma, not lightness. On the same Lempo Isle, the open-air frame has a lightness median of 0.41, a chroma median of 0.130, and 3.91% achromatic. This corner, with not one scrap of sky in the frame, has a lightness median of 0.30 — only 0.11 lower — while its chroma median falls to 0.036, 27% of the other's, and its achromatic share swells to 30.12%, 7.7 times as much. How much colour a picture has is not decided by how bright it is, but by whether the sky can reach it.

01

Where no lamp reaches there is not even 0.01 of chroma

The tall bulkhead filling the left half, which reads as dark green, measures L 0.22 and chroma 0.008 across all 56,762 of its pixels — and the entire stretch of green through cyan, 90°–210°, has not a single pixel inside it. It is not dark green; it has no colour. The rust-coloured wall on the right, the one the eave lamp reaches, is L 0.37, chroma 0.057, 13°: only 0.15 brighter than the bulkhead, and seven times as chromatic. The same corner, the same sheet metal. The whole difference is whether a lamp lands on it.

02

The chroma ceiling is held up entirely by the glow bars

Set aside the 0.06% of cyan and the six hue bands share almost one number for mean chroma: red 0.047, orange 0.057, yellow 0.051, blue 0.045, violet 0.050, pink 0.041 — a range of just 0.016. The same six bands run 0.32 / 0.40 / 0.57 / 0.25 / 0.34 / 0.37 in lightness, a range of 0.32. Hue and lightness are still moving; chroma alone has been pinned down. Only two things that light themselves actually cross the line: the pink glow bar under the railing on the left, whose most chromatic 3% is L 0.48, chroma 0.172, 1°, peaking at 0.176; and the pillar wrapped in violet light at the right edge, whose most chromatic 3% is L 0.50, chroma 0.143, 302°, peaking at 0.175. The frame's chroma 99th percentile is 0.115 and its peak 0.216 — and only the glow bars reach either number.

03

Daylight does not behave this way

〈Bantan Sango Detective Agency in Daytime Shade〉 crops the sky almost entirely out of frame — the blue band is down to 22.70%, and of the 4000 most chromatic pixels the sky holds 0 — and still the shadow below the eyeline reads chroma 0.054 at 251°, a mere 4° of hue from that sky's 0.120 / 247°. In daylight, moving the sky out of frame leaves the share the sky hands to every backlit surface; it only loses half its chroma. Here there is no such share. The left bulkhead's 0.008 is what that bill looks like at zero. 〈Hezhe Post under the Eaves〉 was 75.1% achromatic at a chroma median of 0.011, with every colour borrowed from two openings; this corner has no opening at all, only lamps. So do not build a dark scene by pushing lightness down — the two frames' lightness medians differ by 0.11 and read as different worlds. Decide first which surfaces a lamp reaches, give them all the chroma, and push everything else to neutral.

Take these colours with you

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

/* Lempo Isle, a Lamplit Corner · Lempo Isle, a Lamplit Corner — Teyvat Palette */
:root {
  --hull-black: oklch(0.22 0.008 251); /* Hull Black #181b1e */
  --deck-violet: oklch(0.38 0.056 304); /* Deck Violet #493b5b */
  --rust-wall: oklch(0.37 0.057 13); /* Rust Wall #5a3337 */
  --eave-lamp: oklch(0.7 0.038 46); /* Eave Lamp #b3988b */
  --pillar-violet: oklch(0.5 0.143 302); /* Pillar Violet #734ba6 */
  --glow-bar-pink: oklch(0.48 0.172 1); /* Glow Bar Pink #a41f58 */
  --gradient-lunar-treasury-lempo-isle-location-context: linear-gradient(90deg, oklch(0.22 0.008 251) 0%, oklch(0.38 0.056 304) 35%, oklch(0.37 0.057 13) 70%, oklch(0.7 0.038 46) 100%);
}

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