
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 180° (used by the hero and exports), while gallery cards share a uniform 135° sweep.
Once lightness is spent, you may decline to let chroma take over — silence both axes and the picture does not collapse, it becomes air. Dragon-Queller's total lightness travel is only 0.28 (p01 0.63 → p99 0.91), the narrowest of the four high-key Liyue landscapes; and when the frame's 4000 most chromatic pixels are split by hue into seven groups, every group's mean chroma lands between 0.103 and 0.107, a spread of 0.004. Set it against 〈The Inverted City in Dim Light〉: that picture's lightness travel is narrower still, 0.12 (p01 0.18 → p99 0.30), yet 124 pixels of gold hold the ceiling alone at 0.119, and a protagonist is born. Dragon-Queller lets nobody hold it alone, and gets fog instead.
CSS variables, a Tailwind v4 theme or SVG — one click to copy into your project.
/* Dragon-Queller in Flat Light · Dragon-Queller in Flat Light — Teyvat Palette */
:root {
--cliff-pale: oklch(0.81 0.037 226); /* Cliff Pale #a9c6d3 */
--vein-cyan: oklch(0.84 0.106 215); /* Vein Cyan #6fdcf6 */
--queller-gold: oklch(0.77 0.106 37); /* Queller Gold #ef9c84 */
--riverside-green: oklch(0.82 0.064 126); /* Riverside Green #bacc9f */
--far-sky: oklch(0.89 0.061 241); /* Far Sky #b8e1ff */
--gradient-dragon-queller: linear-gradient(180deg, oklch(0.89 0.061 241) 0%, oklch(0.81 0.037 226) 26%, oklch(0.77 0.106 37) 50%, oklch(0.84 0.106 215) 70%, oklch(0.82 0.064 126) 100%);
}A 1080×1350 PNG carrying the scene, its palette and every value — save it and post it as is.