璃月昼辽阔熙攘远眺

云来海·远照

The Sea of Clouds in Far Light

色卡

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

重构渐变

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

0%c9e2f630%7cbadc55%629fb576%67b4b2100%c6907a

为什么和谐

白要当光,得离邻居的色相远一点,或者干脆别有色相;只把彩度砍掉一半,它仍然只是天。云来海最亮的 4000 个像素在上缘两格,L 0.90 和 0.89、彩度 0.039 和 0.042、色相都是 243°——相对头顶那条天的 0.086 确实砍掉了一半以上,可 243° 离全图 76.02% 的蓝带均值 233° 只差 10°,它于是被并进天里,读作更远,不读作光。这张画因此没有光源,焦点只能由下缘自己去挣。

云还是蓝的

上缘那两格:(0.8, 0.0) 1884 个像素 L 0.90 / 彩度 0.039,(0.4, 0.0) 1209 个 L 0.89 / 彩度 0.042,色相都是 243°。头顶那条天——(0.30, 0.00) 起、宽 0.40 高 0.09——整体 L 0.80 / 彩度 0.086 / 234°,最艳的 3% 是 0.102。按〈枫丹廷·朗照〉的口径,继承邻居的色相再把彩度砍到六成就够格叫白,这朵云砍得比六成还狠;可它砍完之后离蓝带均值只有 10°。同一把尺量〈琼玑野·晴午〉,最亮的 4000 个像素是 L 0.97 / 彩度 0.039–0.040;量〈璃月港·晴昼〉是 L 0.95–0.96 / 彩度 0.046–0.049。三张画的明度顶端都保留着颜色,三张画的主角也都不在上面。

焦点掉到下缘

全图最艳的 4000 个像素里,橙组 1310 个(重心 (0.53, 0.93))、青绿组 823 个((0.58, 0.98))、红组 752 个((0.67, 0.86))、绿组 701 个((0.59, 0.97))——四组合计 3586 个,重心全部压在画面下缘的城与秋树上;剩下的 414 个才分给外海和左侧的岛崖。但这不是因为下面更艳:画面上 55% 与下 45% 各自最艳的 3% 是 0.103 与 0.111,只差 0.008。差的是色相,上半 238°、下半 170°。明度顶端不肯当光,注意力就只好去找唯一在色相上说了别的话的那一块。

同一座城,同一把尺

全图色相落在 330°–90° 且彩度达到 0.025 的像素有 35,241 个,占 4.00%;同一个窗口量〈璃月港·晴昼〉那张,是 31,329 个、3.56%。两张画的暖色几乎一样多,而两张的天都保留着颜色(L 0.95 / 0.048 与 L 0.90 / 0.039)——所以两张的主角都不是天让出来的,都是暖色自己挣的。这条尺是双向的:顶端归零可以指定一个光(珉林 0.005、来歆山 0.021),顶端不归零也不是错,只是把指认主角的活推给了别的轴。别默认最亮的那块就是主角,先量它交出了多少彩度。

带走这组颜色

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

/* 云来海·远照 · The Sea of Clouds in Far Light — Teyvat Palette */
:root {
  --cloud-rim: oklch(0.9 0.039 243); /* 云缘白 #c9e2f6 */
  --sea-sky: oklch(0.76 0.08 233); /* 海天蓝 #7cbadc */
  --cliff-shadow: oklch(0.67 0.071 222); /* 崖影蓝 #629fb5 */
  --shoal-jade: oklch(0.72 0.077 193); /* 浅湾碧 #67b4b2 */
  --eave-vermilion: oklch(0.7 0.074 43); /* 檐瓦朱 #c6907a */
  --gradient-sea-of-clouds: linear-gradient(180deg, oklch(0.9 0.039 243) 0%, oklch(0.76 0.08 233) 30%, oklch(0.67 0.071 222) 55%, oklch(0.72 0.077 193) 76%, oklch(0.7 0.074 43) 100%);
}

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

色卡