Teyvat PaletteTeyvat colour cards
Scene library
GitHub
Gallery
Lambad's Tavern under Open Sky
SumeruDayWide OpenBoisterousBuoyant

Lambad's Tavern under 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%98556112%45426826%5d9ac238%e66b4a52%39807176%78676a100%b2af97

Why it works

The loudest colour overhead may not send a single pixel down to the ground. A whole sheet of red bunting crosses the top third of this frame: inside a 330°–40° window it holds 53,418 pixels at chroma 0.090 and hue 9°, and the frame's chroma ceiling of 0.190 sits in that same band. Yet the paving directly beneath it puts only 204 of its 138,240 pixels inside that window — 0.15% — and its hue from y 0.70 down to 0.94 runs 108°/102°/95°/101°/100°/100°/103°, indistinguishable from the 100° of stone in direct sun. In the same batch, «Bimarstan under a Green Awning» has 54,237 pixels of green canopy that swing the ground beneath it to 159°, a mere 3° from the cloth itself. Two pieces of cloth of near-identical area: one hands its hue over, the other hands over nothing. The difference is how high it hangs, and whether the sky is closed off. For an occluder to work as a fill light it has to own the patch of sky above the surface it is meant to colour — being loud is not enough.

01

53,418 against 204

The red bunting and awning cloth in the top third total 53,418 pixels inside 330°–40°, at chroma 0.090 and hue 9°. The paving directly below runs to 138,240 pixels, of which the same window catches 204 — 0.15%. The ground as a whole measures L 0.72 / chroma 0.036 / 104°, with not one red pixel picked up. The only thing along the upper edge that does enter the light's ledger is the signboard over the door: its most chromatic 3% reads L 0.67 / chroma 0.161 / 36°, and its peak of 0.190 is the frame's ceiling — carried not by fill light but by the fact that the sign itself is in direct sun. Cloth blocks light; it does not give light, unless what it blocks is exactly the sky that surface was looking at.

02

A shadow at chroma 0.023

The cast shadow across the middle of the steps runs 4,544 pixels at L 0.53 / chroma 0.023 — under the achromatic line of 0.025, unable to report a hue at all. The sunlit steps beside it read L 0.75 / chroma 0.033 / 100°. The sky here is wide open (46,716 pixels inside 210°–270° in the top quarter of the frame, averaging 239°) and every surface around is pale stone burnt bright by the sun, so the fill arrives from the whole hemisphere rather than from any one object. What is left in the shadow is only how much light went missing, never whose light it was. If you want a shadow to have colour, first give it a neighbour close enough and large enough. If you cannot, do not force one — a shadow that is honestly achromatic beats a shadow faked blue.

03

The sky did not turn the ground blue either

14.18% of this picture is sky, and the patch at the left edge measures 253°, so an open sky ought to dye every shaded surface with its hue — which is exactly what its batch-mate «Puspa Café in Bleached Noon» does, where the paving fallen into deep shade reads 235° against a zenith of 237°, a difference of 2°. Not here: apart from that one cast shadow at chroma 0.023 which cannot report a hue, the ground from x 0.30 to 0.60 runs 94°–108° at lightness 0.69–0.80, and there is barely a shaded surface to speak of. For the skylight bill to arrive, something has to block the sun; where everything is in direct light, the sky may as well have no colour. To bring a sky into your palette, first put a shadow on the ground.

Take these colours with you

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

/* Lambad's Tavern under Open Sky · Lambad's Tavern under Open Sky — Teyvat Palette */
:root {
  --bunting-crimson: oklch(0.53 0.09 9); /* Bunting Crimson #985561 */
  --bunting-indigo: oklch(0.4 0.064 287); /* Bunting Indigo #454268 */
  --open-sky-blue: oklch(0.66 0.087 239); /* Open-Sky Blue #5d9ac2 */
  --signboard-amber: oklch(0.67 0.161 36); /* Signboard Amber #e66b4a */
  --leaf-eave-teal: oklch(0.55 0.076 177); /* Leaf-Eave Teal #398071 */
  --hueless-shadow: oklch(0.53 0.023 3); /* Hueless Shadow #78676a */
  --sunlit-steps: oklch(0.75 0.033 100); /* Sunlit Steps #b2af97 */
  --gradient-lambads-tavern-exterior: linear-gradient(180deg, oklch(0.53 0.09 9) 0%, oklch(0.4 0.064 287) 12%, oklch(0.66 0.087 239) 26%, oklch(0.67 0.161 36) 38%, oklch(0.55 0.076 177) 52%, oklch(0.53 0.023 3) 76%, oklch(0.75 0.033 100) 100%);
}

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