LiyueDayCool and dimWayfaringTimber

Hezhe Post beneath the Eaves

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

0%232e2e30%3d4c5a62%61b0d384%987a5d100%eaddbc

Why it works

An interior's colour is borrowed from outside. 75.1% of this frame sits below the grey threshold at a median chroma of 0.011 — the timber itself has almost no colour, and every bit of it arrives through two openings: a warm 8.9% of sunlight and a cool 13.5% of sky.

Three quarters of the frame has no colour

Achromatic pixels: 75.1%, at a median chroma of 0.011. The wall on the left measures L 0.28 at chroma 0.011; the floor in the foreground, L 0.29 at 0.014 — together half the picture, and their colour is zero. "A warm timber way station" is an impression, not a measurement: what builds the impression is the yellow band's 8.9% (mean 63°, chroma 0.050). To make a space read as warm you need not warm the whole space; one strip of warm light, bright enough, will do it.

Two openings, two hues, 164° apart

The sunlit railing on the right measures L 0.60, chroma 0.056, hue 65°; the plaster and sky glimpsed through the gaps under the eaves, L 0.60–0.72, chroma 0.047–0.093, hue 229°. Identical in lightness and 164° apart in hue — near enough to opposite, and not a designed complement but physics: direct sun leans yellow, the sky's diffuse light leans blue. Which is why the structure of interior colour always comes down to the proportion between those two openings.

The most saturated place is the deepest in the frame

Among the most saturated four thousand pixels, the largest cluster averages L 0.72, chroma 0.093, hue 229°, at (0.56, 0.58) — the far wall, washed by sky light and visible only past two layers of eaves. The second cluster, L 0.66, chroma 0.086, hue 68°, sits on the railing at (0.92, 0.69). The two most saturated places are the furthest and the nearest, and the colourless timber spread between them becomes the frame. Surround a chromatic distance with an achromatic foreground and depth holds without a single perspective line.

Take these colours with you

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

/* Hezhe Post beneath the Eaves · Hezhe Post beneath the Eaves — Teyvat Palette */
:root {
  --hall-grey: oklch(0.29 0.014 199); /* Hall Grey #232e2e */
  --eave-shade: oklch(0.41 0.03 246); /* Eave Shade #3d4c5a */
  --outside-blue: oklch(0.6 0.047 229); /* Outside Blue #638697 */
  --far-wall: oklch(0.72 0.093 229); /* Far Wall #61b0d3 */
  --sunlit-timber: oklch(0.6 0.056 65); /* Sunlit Timber #987a5d */
  --timber-highlight: oklch(0.9 0.046 90); /* Timber Highlight #eaddbc */
  --gradient-hezhe-post: linear-gradient(285deg, oklch(0.29 0.014 199) 0%, oklch(0.41 0.03 246) 30%, oklch(0.72 0.093 229) 62%, oklch(0.6 0.056 65) 84%, oklch(0.9 0.046 90) 100%);
}

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