纳塔夜幽绿静伏独明

悬木人秘藏之所·夜绿

Scions of the Canopy Secret Space, Green Night

色卡

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

重构渐变

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

0%171a1038%152e2d58%4a5f7c72%89a0a8100%143710

为什么和谐

「在发光」不必在任何一条通道上领先很多:悬木人这扇门的彩度 0.054 只有全图中位数 0.023 的 2.3 倍,明度 0.48 也只有中位数 0.23 的 2.1 倍,两条都远低于〈烟硌山峰·洞光〉里那丛 5.2 倍彩度的浮叶——可它是全画唯一读得出在发光的东西。因为洞光那张的两个候选各只占一条:洞口拿明度而彩度 0.034 正好等于中位数,浮叶拿彩度而明度不占优。两条通道各领先两倍,比一条领先五倍更像光。

两个 2 倍,胜过一个 5 倍

全图彩度中位数 0.023、明度中位数 0.23,而门那块实测 L 0.48 / 彩度 0.054 / 色相 257°,两条通道各是中位数的 2.1 倍和 2.3 倍;门里翻涌的那层光更艳一点,彩度最高的 4000 个像素有 1961 个落在 (0.36, 0.51),均值彩度 0.089 / 色相 276°。〈烟硌山峰·洞光〉那张里两个候选各只占一条:洞口 L 0.79 却彩度 0.034,正好等于它自己的彩度中位数;水面浮叶彩度 0.178(中位数的 5.2 倍)却和四周一样暗。发光是一个二维的位置,不是一根柱子的高度——想让一样东西亮起来,先看它在明度榜和彩度榜上分别排第几,再决定补哪一条。

两丛「橙色」灌木实测 118° 和 123°

门左边的岩缝里和右边草坡上各有一丛灌木,肉眼看是暖橙的;实测 L 0.20 / 彩度 0.033 / 色相 118°,和 L 0.22 / 0.038 / 123°——绿的。对全图做 15°–45° 的暖色搜索,九十二万个采样像素里只捞到 2 个。这幅夜景的绿不是材质的绿,是光的绿:140° 的环境色把每一样东西的固有色都收编了,连最该翘出来的那两丛也没剩下。〈沙虫隧道·沙照〉里 165°–345° 一个像素都没有,靠的是洞里再没有第二个光源;这里全图最亮的 4000 个像素有 3827 个挤在门槛那一小块 (0.36, 0.71),均值 L 0.69,其余画面没有第二处受光——露天的夜,和洞里是一样的算法。

最艳的一块铺在地上

全图彩度最高的面不是门,是门前那片草坡:实测 L 0.30 / 彩度 0.076 / 色相 142°,比门的 0.054 高出四成,面积也大得多。它不抢戏,因为它铺在地面上、明度只有 0.30——彩度榜第一,明度榜垫底。右侧那根巨大的树干走的是另一条路,L 0.28 / 彩度 0.031 / 色相 192°,两榜都不占,于是它只是一道轮廓。做界面同理:想让一块高饱和的色不抢焦点,把它压在低明度上再铺开,它就退回底色;想让它抢,补的是另一条通道,不是同一条。

带走这组颜色

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

/* 悬木人秘藏之所·夜绿 · Scions of the Canopy Secret Space, Green Night — Teyvat Palette */
:root {
  --night-rock-green: oklch(0.21 0.018 122); /* 夜岩绿 #171a10 */
  --trunk-teal: oklch(0.28 0.031 192); /* 巨木青 #152e2d */
  --slope-grass: oklch(0.3 0.076 142); /* 坡草绿 #143710 */
  --gate-blue: oklch(0.48 0.054 257); /* 门蓝 #4a5f7c */
  --gate-violet: oklch(0.48 0.089 276); /* 门芯紫 #50588f */
  --threshold-white: oklch(0.69 0.029 222); /* 门槛白 #89a0a8 */
  --gradient-tribal-secret-space-scions-of-the-canopy-location-context: linear-gradient(180deg, oklch(0.21 0.018 122) 0%, oklch(0.28 0.031 192) 38%, oklch(0.48 0.054 257) 58%, oklch(0.69 0.029 222) 72%, oklch(0.3 0.076 142) 100%);
}

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

色卡