Teyvat PaletteTeyvat colour cards
Scene library
GitHub
Gallery
Collective of Plenty Secret Space, Torchlit Dark
NatlanSealed InTorch ShadowDeep Passage

Collective of Plenty Secret Space, Torchlit Dark

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%281f1e18%322f1338%46271e56%5c698370%322a1f100%c05722

Why it works

The terminus is named by the path, not by the light. The gate at the top of the stair measures L 0.52 / chroma 0.045 / hue 264°, while every one of the 4000 most chromatic pixels in the frame sits on the two torches (chroma 0.149 and 0.154); the last step leading up to the gate measures chroma 0.022, under the achromatic line of 0.025 and the greyest thing on the whole path. To nominate a focus you do not have to make it lead on any channel — run a converging path up to its feet, then push the last stretch of that path to the lowest reading in the picture.

01

Not one of the four thousand most chromatic pixels is on the gate

Two torches flank the stair, and they measure as near-duplicates of one another: left L 0.58 / chroma 0.149 / hue 44°, right L 0.58 / 0.154 / 45°. All 4000 of the frame's most chromatic pixels land on them, with centroids between (0.50, 0.82) and (0.53, 0.81). «Great Hall of Truths by Brazier Light» measured the same pair — left brazier 906 pixels, right brazier 865, both at L 0.84, chroma 0.118 against 0.122 — and concluded that two identical lights cancel each other's claim to «brightest», handing the focus to the 0.50% of teal on the centre axis: what wins is owning a hue outright. The cancellation happens here too, but nothing inherits by hue. The violet band 270°–315° covers 3.95% of the frame at a mean chroma of 0.067, above the gate core's 0.045, and only 10049 pixels inside the gate core rectangle fall in 260°–300° — the gate neither owns that hue nor holds the deepest patch of it. What inherits is the end of the stair.

02

The last step of the path is the greyest surface in the frame

Walking the stair from the bottom edge up to the gate, four treads measure L 0.38 / 0.38 / 0.33 / 0.29 and chroma 0.075 / 0.075 / 0.051 / 0.022 — the tread before the threshold has already fallen under the achromatic line of 0.025, and the frame's chroma median is exactly 0.023. The brightest 4000 pixels land in only two places: 2586 on the gate, 1414 on the two torches, and not one on the stair between them. The terminus is not lit, it is marked by the light failing to reach it — light at the near end, the path darkening through the middle, the gate glowing on its own at the far end. To make something read as an end point, drain the stretch in front of it first: do not strengthen it, weaken its neighbour.

03

The sixth channel is not a colour

This gate is one shared asset across the six Natlan tribal secret spaces, and its absolute colour barely moves: «Scions of the Canopy Secret Space, Green Night» measured L 0.48 / chroma 0.054 / 257°, 2.3 times that picture's chroma median of 0.023; «Masters of the Night-Wind Secret Space, Rosy Light» measured L 0.57 / 0.070 / 295°, chroma identical to its own median, seen by hue alone. This one is L 0.52 / 0.045 / 264°, short of twice the median 0.023 and sitting between the two — on the chroma ruler of «what makes the gate visible» it genuinely offers no new position. Yet it is found more easily here than in any of them, while the tribal paint covering the whole upper-right cliff (measured L 0.30 / chroma 0.044 / hue 103°, about as saturated as the gate and far larger) draws nobody: it is not on the path. Same in interface work — do not expect a component reused across themes to be found by its own colour. Draw a route to it, and make the last stretch of that route the lowest-contrast stretch.

Take these colours with you

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

/* Collective of Plenty Secret Space, Torchlit Dark · Collective of Plenty Secret Space, Torchlit Dark — Teyvat Palette */
:root {
  --vault-dark: oklch(0.25 0.014 27); /* Vault Dark #281f1e */
  --cliff-ochre: oklch(0.31 0.05 36); /* Cliff Ochre #46271e */
  --tribal-green: oklch(0.3 0.044 103); /* Tribal Green #322f13 */
  --torch-flame: oklch(0.58 0.149 44); /* Torch Flame #c05722 */
  --gate-blue: oklch(0.52 0.045 264); /* Gate Blue #5c6983 */
  --threshold-grey: oklch(0.29 0.022 71); /* Threshold Grey #322a1f */
  --gradient-tribal-secret-space-collective-of-plenty-location-context: linear-gradient(180deg, oklch(0.25 0.014 27) 0%, oklch(0.3 0.044 103) 18%, oklch(0.31 0.05 36) 38%, oklch(0.52 0.045 264) 56%, oklch(0.29 0.022 71) 70%, oklch(0.58 0.149 44) 100%);
}

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