Teyvat PaletteTeyvat colour cards
Scene library
GitHub
Gallery
Wangshan Hall, Mossglow
LiyueVerdant GloomDamp MossDeep Ground

Wangshan Hall, Mossglow

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%9fa77820%0e130c52%181f1882%6f8d64100%a6cf93

Why it works

"Glowing" is not a matter of chroma being high enough — it is a matter of out-measuring the light source visible in the same frame: the rift in the vault reads L 0.71, chroma 0.066, while the ring of moss it lights reads L 0.81, chroma 0.093 — 2910 of the 4000 brightest pixels land on that moss, and the opening keeps only 232. Once a light source loses to the ground it lights, that ground stops reading as lit and starts reading as luminous.

01

The skylight loses to the ground it lights

The only external light source in frame is that rift at the centre of the vault, with a shaft slanting down out of it — and yet both channels of the picture grow the other way: the top third reads L 0.29, chroma 0.034, and the 22%-tall band along the bottom edge reads L 0.43, chroma 0.058, lightness up by nearly half and chroma by seven tenths. The skylight measures L 0.71, chroma 0.066; the pool of moss at the spire's foot measures L 0.81, chroma 0.093, and wins on both. Of the 4000 brightest pixels, 2910 sit on that moss at (0.53, 0.69) and only 232 at the opening. The two lit windows of the cottage below the left cliff are the second strongest light in the room — their most chromatic 3% reaches L 0.82, chroma 0.134 — and still fall short of the moss's 0.178 measured the same way.

02

The ratio yardstick fails here

〈Ashveil Peak, Cavern Glow〉 left us a yardstick: glowing is the ratio of ceiling to floor — the floating leaves in that cave measure chroma 0.178 against a frame median of 0.034, 5.2×, and only then read as luminous, while outside in 〈Evening Haze〉 the light source at 0.209 against a median of 0.084 is a mere 2.5× and does not. Here the moss's 0.093 against this frame's median of 0.042 is 2.2× — below even that "not yet" 2.5× — and nobody would say it isn't glowing. The difference is that neither of those two pictures shows a light source at all, so the median had to serve as the floor; this picture puts the source inside the frame, and the floor should move to it.

03

The spire is lit, the moss is luminous

The cluster of jade spires at the centre — a pale crystal column standing on a round stone dais — is the compositional subject, and measures L 0.61, chroma 0.070: it loses on lightness to the skylight's 0.71 and merely ties its chroma of 0.066. One loss and one draw, so it reads as a stone with light falling on it. The moss ringing it reads L 0.81, chroma 0.093, clearing the skylight on both channels at once — and the two objects swap identities on that alone. To make an element glow in a dark interface, put the light source on the same screen first, then let the element clear it in lightness and chroma together; clear only one and it is still merely lit.

Take these colours with you

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

/* Wangshan Hall, Mossglow · Wangshan Hall, Mossglow — Teyvat Palette */
:root {
  --moss-glow: oklch(0.81 0.093 136); /* Mossglow Green #a6cf93 */
  --shaft-light: oklch(0.71 0.066 116); /* Shaft Light #9fa778 */
  --jade-spire: oklch(0.61 0.07 138); /* Jade Spire #6f8d64 */
  --lamp-window: oklch(0.82 0.134 91); /* Lamplit Window #e4c052 */
  --pillar-slate: oklch(0.23 0.017 145); /* Pillar Slate #181f18 */
  --cavern-deep: oklch(0.18 0.016 138); /* Cavern Ink #0e130c */
  --gradient-wangshan-hall: linear-gradient(180deg, oklch(0.71 0.066 116) 0%, oklch(0.18 0.016 138) 20%, oklch(0.23 0.017 145) 52%, oklch(0.61 0.07 138) 82%, oklch(0.81 0.093 136) 100%);
}

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