枫丹昼缥缈淡远静谧

枫丹廷区·遥霭

Court of Fontaine Region in Distant Haze

色卡

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

重构渐变

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

0%57a5fc14%e9fdfe38%75c4f758%589fd986%3680b7100%82d270

为什么和谐

雾不把彩度拿走,它把彩度拉成一个常数:枫丹廷区 95.96% 是蓝,远山彩度 0.106、城石 0.112、近水 0.112——三个距离、三种材质,彩度极差只有 0.006,色相全关在 238°–245° 里,而明度从 0.79 一路走到 0.58,极差 0.21。所以六个枫丹场景里最雾的这一张,彩度中位数 0.105 反而比不带雾的白露区 0.093、莫尔泰区 0.091 都高。要画雾,别整体降饱和,把每样东西的彩度收到同一个值上,让明度独自负责远近。

三个距离,一个彩度

地平线上那排锯齿山 L 0.79 / 彩度 0.106 / 色相 238°;水上那座城的石面 L 0.68 / 0.112 / 245°;脚下那片水 L 0.58 / 0.112 / 244°。从最远到最近,彩度动了 0.006、色相动了 7°,明度动了 0.21。同为枫丹雾景的〈诺思托伊区·雾昼〉把纵深拆成两个反向梯度——近水彩度 0.106 到远山 0.079 降 0.027,明度 0.72 到 0.87 升 0.15——并且提醒「只降彩度会显得像蒙了一层灰」。这张画走的是那句话的另一半:彩度那条梯度整根不要,只留明度这一条,纵深照样成立,而且比它更远、更雾。

唯一没隔着空气的东西占 0.47%

全图最艳的一个像素彩度 0.180,坐标 (0.56, 0.98)——画面最下缘,镜头脚边那一小撮草。绿带只占 0.47%,它最艳的 3%(124 个像素)均值 L 0.79 / 彩度 0.155 / 色相 140°,而整幅画的彩度中位数 0.105、p99 只有 0.154:一撮不到半个百分点的草单独顶起了这张画的天花板,只因为它是全画唯一一样不站在空气后面的东西。反过来的证据更硬——对全图做 330°–90° 的暖色搜索,一个像素都没有匹配。这座城的每一片屋顶、每一段桥面都被同一片空气换过色相了。

雾先没收的是暗

全图明度 p01 是 0.54:最暗的百分之一也在 0.54 之上。〈枫丹廷·朗照〉从近处画同一座城,那面读作白石的墙 L 0.53、比它自己的明度中位数低 0.19,是画里显眼的一块暗面;退到这个距离,城的石面抬到 0.68,和眼前的水一样是 0.112 的彩度,不再是任何一头的极值。雾把地板抬上来、把天花板压下去(p99 0.154 是六个枫丹场景里最低的),两头一起收。所以远景要的是「窄」不是「淡」:先决定这段距离允许多宽的明暗和彩度,再在这条窄带里排远近。

带走这组颜色

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

/* 枫丹廷区·遥霭 · Court of Fontaine Region in Distant Haze — Teyvat Palette */
:root {
  --zenith-blue: oklch(0.71 0.15 253); /* 天顶蓝 #57a5fc */
  --high-cloud: oklch(0.98 0.021 199); /* 高云白 #e9fdfe */
  --far-ridge: oklch(0.79 0.106 238); /* 远岭霭 #75c4f7 */
  --court-stone: oklch(0.68 0.112 245); /* 城石蓝 #589fd9 */
  --near-bay: oklch(0.58 0.112 244); /* 近湾蓝 #3680b7 */
  --shore-green: oklch(0.79 0.155 140); /* 岸草绿 #82d270 */
  --gradient-court-of-fontaine-region: linear-gradient(180deg, oklch(0.71 0.15 253) 0%, oklch(0.98 0.021 199) 14%, oklch(0.79 0.106 238) 38%, oklch(0.68 0.112 245) 58%, oklch(0.58 0.112 244) 86%, oklch(0.79 0.155 140) 100%);
}

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

色卡