璃月幽深润泽苍绿

Roots of the Valley of Life·隙翠

Roots of the Valley of Life in Filtered Green

色卡

点击色块复制 HEX;悬停查看 OKLCH 值。

重构渐变

从场景蒸馏出的渐变,按停靠点从左到右展开;成品角度 180°(hero 与导出使用),画廊卡片统一以 135° 斜向展示。

0%b8c58e30%748f6a62%164940100%59a143

为什么和谐

光把明度和色相两根通道一起占满之后,彩度就是唯一还能报「这是什么东西」的通道,而它只能由材质自己出:这里离光越远色相越青、明度越低(137° / 154° / 161° / 179° / 183° 对 L 0.62 / 0.40 / 0.43 / 0.37 / 0.36),这五处的彩度却是 0.063 / 0.064 / 0.065 / 0.056 / 0.051,极差 0.014。唯一出列的是那块被光落到的草丘——和光柱根部几乎同深(138° 对 137°、L 0.59 对 0.62),彩度 0.103 却是它的 1.6 倍。

这束光本身是绿的

顶上那道漏下来的光看着是暖白的,实测是绿:最亮的 4000 个像素里 878 个的重心在 (0.63, 0.30)、800 个在 (0.57, 0.32),都在光柱上,L 0.80 / 0.82,C 0.075 / 0.081,色相 119° / 115°;柱根(0.55, 0.02 起)137°。全画 `200°–100°` 这个 260° 宽的窗口只有 12,000 个像素(1.36%),其中 10,075 个在左下角那丛菌菇上(12°)。光在进画之前已经被头顶的枝叶染过一遍,所以洞里没有一样东西报得出太阳的颜色。

离光多远,由色相和明度一起说

从光走向深处:柱根(0.55, 0.02 起)137° / L 0.62,受光草丘(0.30, 0.80 起)138° / 0.59,左侧近景(0.15, 0.55 起)154° / 0.40,中景巨根(0.35, 0.50 起)161° / 0.43,右后(0.62, 0.55 起)179° / 0.37,左侧最深处(0.08, 0.15 起)183° / 0.36。绿带 54.15%(148°)与青带 44.25%(181°)对分了 98.40% 的画面,可这两条带不是两种材质,是同一批材质离光的两个距离。〈地下矿区·遥光〉正好相反:那张画的色相全程钉在 210°–217° 不动,纵深由明度和彩度绑成一根滑杆走完。

彩度是留给材质的那一根

上面六处的彩度是 0.063 / 0.103 / 0.064 / 0.065 / 0.056 / 0.051——去掉草丘,极差只有 0.014,和它们相差 46° 的色相、0.26 的明度完全不成比例。草丘就凭这一根出列:全图最艳的 4000 个像素有 3,999 个落在 120°–150°、重心 (0.54, 0.84),均值 0.148,全图峰值 0.200 也在那里,而它的明度 0.59 比光柱根部的 0.62 还低。〈帕哈岛·窟光〉是这条的反面——那张画的明度整根被「离光多远」占用,纵深只好改挂到彩度上。两张合起来是一条:「离光多远」和「这是什么」必须分占不同的通道,谁先占了哪根,另一件事就只剩下的用。想让一样东西在被光统治的场景里被认出来,别去调它的明暗和色相,给它高出邻居一半的彩度。

带走这组颜色

CSS 变量、Tailwind v4 主题或 SVG,一键复制到你的项目。

/* Roots of the Valley of Life·隙翠 · Roots of the Valley of Life in Filtered Green — Teyvat Palette */
:root {
  --shaft-green: oklch(0.8 0.075 119); /* 漏光绿 #b8c58e */
  --lit-turf: oklch(0.64 0.148 139); /* 草丘翠 #59a143 */
  --root-cyan: oklch(0.43 0.065 161); /* 藤根青 #2b5b44 */
  --abyss-cyan: oklch(0.36 0.051 183); /* 渊底青 #184640 */
  --cap-red: oklch(0.44 0.058 23); /* 菌伞红 #6f4643 */
  --gradient-roots-of-the-valley-of-life: linear-gradient(180deg, oklch(0.8 0.075 119) 0%, oklch(0.62 0.063 137) 30%, oklch(0.37 0.056 179) 62%, oklch(0.64 0.148 139) 100%);
}

1080×1350 的 PNG,原图、色卡与色值都在里面——存下来直接发。

色卡