
Click a swatch to copy its HEX; hover for the OKLCH value.
The gradient distilled from the scene, unrolled left to right by stop; the authored angle is 200° (used by the hero and exports), while gallery cards share a uniform 135° sweep.
What takes over the ambient colour when there is no daylight — this batch answers it three ways, and this study answers on the axis of depth. «Wenut Tunnels by Sandlight» says hue belongs to the light rather than to the material; «Ashveil Peak, Cavern Glow» says light and colour come from two different sources. The pivot here is that lightness, as a lever, has already been used up on how far a surface sits from a light: four layers of rock from near to far measure L 0.26 → 0.22 → 0.24 → 0.32 and double back twice, while the chroma of that same rock runs 0.076 → 0.068 → 0.057 → 0.059 and never turns around. Depth has to be moved onto chroma wholesale.
CSS variables, a Tailwind v4 theme or SVG — one click to copy into your project.
/* Paha Isle by Cavern Glow · Paha Isle by Cavern Glow — Teyvat Palette */
:root {
--vault-violet: oklch(0.19 0.057 274); /* Vault Violet #0d102d */
--near-wall: oklch(0.26 0.076 282); /* Near Wall #1f1d47 */
--far-rock: oklch(0.32 0.059 270); /* Far Rock #273151 */
--far-slot: oklch(0.69 0.06 262); /* Slot Light #879cc1 */
--cap-glow: oklch(0.62 0.145 334); /* Cap Glow #b961aa */
--spire-blue: oklch(0.51 0.079 260); /* Spire Blue #4b6693 */
--floor-rill: oklch(0.39 0.076 257); /* Floor Rill #29466d */
--gradient-lunar-treasury-paha-isle-location-context: linear-gradient(200deg, oklch(0.19 0.057 274) 0%, oklch(0.32 0.059 270) 26%, oklch(0.69 0.06 262) 44%, oklch(0.39 0.076 257) 66%, oklch(0.62 0.145 334) 100%);
}A 1080×1350 PNG carrying the scene, its palette and every value — save it and post it as is.