
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.
A warm band worth 2.3% of the frame rewrites the hour. Violet holds 83.9% at a median chroma of 0.115, and only that narrow strip on the horizon — L 0.85, hue 42° — tells you this is dusk rather than deep night. Take it away and the same violet becomes night.
CSS variables, a Tailwind v4 theme or SVG — one click to copy into your project.
/* Seirai Island under the Storm's Eye · Seirai Island under the Storm's Eye — Teyvat Palette */
:root {
--storm-violet: oklch(0.33 0.116 296); /* Storm Violet #3c2369 */
--lagoon-violet: oklch(0.47 0.101 293); /* Lagoon Violet #5e4e8e */
--grove-violet: oklch(0.51 0.198 298); /* Grove Violet #773fc6 */
--eye-halo: oklch(0.67 0.164 300); /* Eye Halo #a67aea */
--last-light: oklch(0.85 0.072 42); /* Last Light #f8bfa9 */
--bolt-white: oklch(0.97 0.022 327); /* Bolt White #fef0fd */
--gradient-seirai-island: linear-gradient(180deg, oklch(0.33 0.116 296) 0%, oklch(0.67 0.164 300) 18%, oklch(0.33 0.116 296) 44%, oklch(0.85 0.072 42) 62%, oklch(0.47 0.101 293) 100%);
}A 1080×1350 PNG carrying the scene, its palette and every value — save it and post it as is.