
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.
The desert is not yellow: the largest hue band in the frame is 39% violet haze, the second 19% rusted red, and the intuitive “desert yellow” does not reach 3% — half of an environment's colour is the colour of its air. Realism begins in the atmosphere, not in the material.
CSS variables, a Tailwind v4 theme or SVG — one click to copy into your project.
/* Desert of Hadramaveth, Sandstorm · Desert of Hadramaveth, Sandstorm — Teyvat Palette */
:root {
--dust-violet: oklch(0.826 0.078 274.6); /* Violet Haze #b6c3f9 */
--rust-lit: oklch(0.724 0.051 34.4); /* Rusted Rock #c49b91 */
--rust-shadow: oklch(0.586 0.055 350.7); /* Crimson Rock #966f80 */
--sand-umber: oklch(0.551 0.062 29.4); /* Sand Brown #93645d */
--dry-gold: oklch(0.548 0.064 95.7); /* Withered Gold #7c7145 */
--gradient-desert-of-hadramaveth: linear-gradient(180deg, oklch(0.826 0.078 275) 0%, oklch(0.724 0.051 34) 38%, oklch(0.586 0.055 351) 70%, oklch(0.551 0.062 29) 100%);
}A 1080×1350 PNG carrying the scene, its palette and every value — save it and post it as is.