
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 90° (used by the hero and exports), while gallery cards share a uniform 135° sweep.
Take the sky away and what a picture loses is chroma, not lightness. On the same Lempo Isle, the open-air frame has a lightness median of 0.41, a chroma median of 0.130, and 3.91% achromatic. This corner, with not one scrap of sky in the frame, has a lightness median of 0.30 — only 0.11 lower — while its chroma median falls to 0.036, 27% of the other's, and its achromatic share swells to 30.12%, 7.7 times as much. How much colour a picture has is not decided by how bright it is, but by whether the sky can reach it.
CSS variables, a Tailwind v4 theme or SVG — one click to copy into your project.
/* Lempo Isle, a Lamplit Corner · Lempo Isle, a Lamplit Corner — Teyvat Palette */
:root {
--hull-black: oklch(0.22 0.008 251); /* Hull Black #181b1e */
--deck-violet: oklch(0.38 0.056 304); /* Deck Violet #493b5b */
--rust-wall: oklch(0.37 0.057 13); /* Rust Wall #5a3337 */
--eave-lamp: oklch(0.7 0.038 46); /* Eave Lamp #b3988b */
--pillar-violet: oklch(0.5 0.143 302); /* Pillar Violet #734ba6 */
--glow-bar-pink: oklch(0.48 0.172 1); /* Glow Bar Pink #a41f58 */
--gradient-lunar-treasury-lempo-isle-location-context: linear-gradient(90deg, oklch(0.22 0.008 251) 0%, oklch(0.38 0.056 304) 35%, oklch(0.37 0.057 13) 70%, oklch(0.7 0.038 46) 100%);
}A 1080×1350 PNG carrying the scene, its palette and every value — save it and post it as is.