SumeruDayBriskSalt-freshUnhurried

Pharos Lighthouse under Fair-Weather Clouds

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%defcfd18%4888c252%adf2fe68%76bd6a100%2866b1

Why it works

Whether grey costs anything depends on which layer of depth it stands in. Pharos's 4.53% achromatic is almost entirely cloud — not one of the brightest 4000 pixels falls below the horizon line, and 3298 of them are packed into the top row of cells at L 0.97 / chroma 0.031 / hue 198°–203°. A big white surface, and it takes nothing off the chroma ceiling: the frame peaks at 0.176, still inside the outdoor constant band (Avidya Forest, Clearing after Rain at 0.165; Ashavan Realm, Deep in the Mist at 0.188), and that peak belongs to the near canopy and the near water. If you want a large neutral surface without draining the whole picture, put it behind every solid thing.

The whitest thing stands in the last layer

Of the brightest 4000 pixels, 3298 sit in the top row of three cells (centred at (0.13, 0.03) and (0.29, 0.02)) at L 0.97 / chroma 0.031 / hue 198°–203° — the cumulus filling the upper half. The remaining 702 are on the same cloud bank to the left, and none crosses the horizon line. It is last in the depth order and blocks nothing between itself and the eye, so this 4.53% of achromatic comes free: it bought area, not chroma. Before laying down a neutral surface, ask what it stands in front of — a neutral that occludes nothing charges nothing.

The ceiling is split between two near surfaces, one lit and one in shadow

The 4000 most chromatic pixels break into two clusters: 2144 in 120°–150° at L 0.73 / chroma 0.135, centred at (0.59, 0.48) — the canopy leaning over the right of the lighthouse; and 1514 in 240°–270° at L 0.51 / chroma 0.134, centred at (0.40, 0.63) — the deep water left of the pier. The two differ by 0.22 in lightness and by 0.001 in chroma. The top of the chroma range is not a prize for the brightest-lit surface; it is a property of position in depth. Both are near, so both reach 0.176.

Apart from the cloud, there is no second grey here

Achromatic is only 4.53%, and everything else holds a hue of its own: the sky between the clouds at 248°, the sun-bleached sea on the left at 209° / chroma 0.070, and the lighthouse dome that reads green measuring 188° — it is cyan, 47° away from the canopy's 141°. The coral palm crowns on the island are the frame's only warmth: 0.03% in 345°–15° plus 0.01% in 315°–345°, and searching the palms' own rectangle in 330°–30° returns a top 3% of just 9 pixels at chroma 0.072. Because the neutral is collected once, in the furthest layer, nothing in front of it has to give ground. To place neutral in a saturated picture, don't scatter it — gather it into the furthest layer, where one surface covers the whole job.

Take these colours with you

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

/* Pharos Lighthouse under Fair-Weather Clouds · Pharos Lighthouse under Fair-Weather Clouds — Teyvat Palette */
:root {
  --island-canopy: oklch(0.73 0.135 141); /* Island Canopy #76bd6a */
  --pier-shadow-blue: oklch(0.51 0.134 255); /* Pier Shadow Blue #2866b1 */
  --dome-cyan: oklch(0.62 0.079 188); /* Dome Cyan #46968f */
  --zenith-blue: oklch(0.61 0.111 248); /* Zenith Blue #4888c2 */
  --horizon-sea: oklch(0.92 0.07 209); /* Horizon Sea #adf2fe */
  --cumulus-white: oklch(0.97 0.031 200); /* Cumulus White #defcfd */
  --gradient-pharos-lighthouse: linear-gradient(180deg, oklch(0.97 0.031 200) 0%, oklch(0.61 0.111 248) 18%, oklch(0.92 0.07 209) 52%, oklch(0.73 0.135 141) 68%, oklch(0.51 0.134 255) 100%);
}

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