SumeruDayAliveDreamlikeVerdant

Vanarana, Green Noon

Palette

Click a swatch to copy its HEX; hover for the OKLCH value.

Reconstructed gradient

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.

0%7eb6e222%7acbe650%80cf63100%3c9335

Why it works

Harmony without grey: Dragonspine mediated three colours with 63% grey, while here grey is only 5.9% and 94% of the frame is chromatic without becoming noise — on two conditions. Keep the hues to two adjacent families, and put a factor of two between their chromas.

Two adjacent families, one clearly the lead

Green (142°) covers 56.9% at C 0.133 and carries the melody; blue (214°–243°) covers 36.2% at C 0.069 and plays accompaniment. Only two hue families, adjacent, with double the chroma on one — that is why nothing clashes without a grain of grey. Neither condition is optional. Read it against the Dragonspine study: the moment the hues multiply, grey has to be called in to mediate.

One green, layered by lightness

Lit leaves at L 0.78, shaded leaves at L 0.59, hue barely moving (138° against 142°). When a single hue holds a large area, every layer in it is lightness — the same law as Enkanomiya's mist, except that one drops chroma to nothing and this one does it in saturated green.

The dream comes from chroma crossing the line

Green peaks at chroma 0.24, and real foliage is rarely this saturated. Vanarana is a dreaming country, and the art deliberately pushes its green past the realistic line. To get surreal without harsh: push only the lead family's chroma and hold the supporting one — the sky blue here — exactly where it is. Crossing a line requires a line to cross.

Take these colours with you

CSS variables, a Tailwind v4 theme or SVG — one click to copy into your project.

/* Vanarana, Green Noon · Vanarana, Green Noon — Teyvat Palette */
:root {
  --dream-leaf: oklch(0.78 0.163 138.4); /* Dream Leaf Green #7fcf64 */
  --leaf-shade: oklch(0.59 0.156 141.8); /* Leaf Shade #3d9334 */
  --sky-cyan: oklch(0.754 0.087 242.8); /* Clear Sky Blue #7eb6e2 */
  --mist-tree: oklch(0.8 0.088 221.3); /* Misted Canopy #7acbe6 */
  --path-tan: oklch(0.7 0.059 87); /* Sand Path Brown #ae9d74 */
  --gradient-vanarana: linear-gradient(180deg, oklch(0.754 0.087 243) 0%, oklch(0.8 0.088 221) 22%, oklch(0.78 0.163 138) 50%, oklch(0.59 0.156 142) 100%);
}

A 1080×1350 PNG carrying the scene, its palette and every value — save it and post it as is.