
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 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.
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.