MondstadtDayClearVerdantSolemn

Forgotten Sword Cemetery in Fair Daylight

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%4469a122%9b776845%a98e5970%607f4a100%4c9ea4

Why it works

A 174° span holds together without a neutral ground under it: yellow 25.54%, green 31.46%, cyan 12.65% and blue 21.24% run end to end and fill the whole 45°–270° arc, while only 6.79% of the frame is achromatic. Lay the span out as an unbroken ramp and leave even its thinnest rung a tenth of the frame, and however far apart the two ends sit, they still read as one place.

That grey rock is not grey

The walls left and right look like grey stone; they measure 77° at chroma 0.052 on the left and 42° at 0.051 on the right — not a neutral ground but the main source of the yellow band's 25.54%. Only 6.79% of the frame is achromatic (C<0.025), where Dragonspine on the same ruler is 39.47%: that study kept three hues apart with a large field of grey that says nothing, and this picture has not one usable patch of it. To let distant hues share a frame, besides giving them a silent ground, you can let every step between them speak.

Even the thinnest rung holds 12.65%

The four bands cover 31.46%, 25.54%, 21.24% and 12.65% — not one of them past a third of the frame — at chroma 0.086, 0.058, 0.082 and 0.069, the highest not even one and a half times the lowest. Vanarana set two conditions for harmony without grey — keep the hues inside two adjacent families, and split chroma into a two-to-one lead and accompaniment — and neither holds here, while grey is just as absent (6.79% against 1.43%). What carries the frame instead is that the ramp skips no rung. Asase Shrine spans the same 174°, but between its poles only two thin gaps of 3.47% and 1.01% remain, which is why its median chroma is 0.052 where this frame runs 0.072. Before reaching for grey to fit four hues into one interface, check whether you dropped the two steps in the middle.

The one red that oversteps is carved into the trunk

Of the 4000 most chromatic pixels, 1544 fall between 0° and 60°, clustered at (0.55, 0.13) and (0.54, 0.17) — the red carving running across the crossed dead trunks. Take the most saturated 3% of that patch and it measures 31° at chroma 0.211, peaking at 0.230: 1.4 times the second-highest step in the frame (green's 0.161), on red and orange bands that together cover 1.07% of it. Note where it sits — the ramp's warm end stops at 45°, so this stroke is the ramp taking one more step outward, not a colour borrowed from across the wheel. Once the ramp is laid, take the accent from the ramp's next rung rather than from the far side.

Take these colours with you

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

/* Forgotten Sword Cemetery in Fair Daylight · Forgotten Sword Cemetery in Fair Daylight — Teyvat Palette */
:root {
  --zenith-blue: oklch(0.52 0.098 258); /* Zenith Blue #4469a1 */
  --sword-pool-teal: oklch(0.65 0.08 202); /* Sword Pool Teal #4c9ea4 */
  --meadow-green: oklch(0.56 0.086 133); /* Meadow Green #607f4a */
  --trunk-moss: oklch(0.66 0.078 84); /* Trunk Moss #a98e59 */
  --cliff-ochre: oklch(0.6 0.051 42); /* Cliff Ochre #9b7768 */
  --rune-vermilion: oklch(0.62 0.211 31); /* Rune Vermilion #ea3f28 */
  --gradient-forgotten-sword-cemetery: linear-gradient(180deg, oklch(0.52 0.098 258) 0%, oklch(0.6 0.051 42) 22%, oklch(0.66 0.078 84) 45%, oklch(0.56 0.086 133) 70%, oklch(0.65 0.08 202) 100%);
}

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