璃月昼澄明疏朗闲远

碧水原·晴汀

Bishui Plain, Sunlit Shallows

色卡

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

重构渐变

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

0%95c9ea12%baf4fd28%5b9bbc50%b1d9c572%8cc27d100%f4eb4f

为什么和谐

浅水没有自己的色相,它是水底和天空之间的一根滑杆,深度决定滑杆停在哪:同一片碧水,贴岸处 164°、离岸的湾中 200°、最远的水道 227°,而天空是 237°——63° 的行程走完,彩度只在 0.050–0.099 之间晃。画水别挑一个「水蓝」,先定两端,再按深浅在中间取值。

岸边那道碧是沙子,不是水

贴着岛缘的浅水实测色相 164°、明度 0.85、彩度 0.050,而天空是 237°、明度 0.81——相差 73°,浅水还比天更亮。水要是在照镜子,它该顶着天的色相、比天更暗;它没有,因为隔着薄薄一层水你看见的是水底。左侧那片湾水从岸边往外取四段(每段一千一百来个像素),色相 182° → 188° → 194° → 200°,一路单调朝天空转;右侧从 163° 转到 190°。水色的等高线就是水深的等高线,所以它贴着每一座岛的海岸线又把轮廓描了一遍——不看陆地,只看水,你也能认出这片群岛的形状。

63° 全部记在色相账上

从贴岸的 164° 到最远水道的 227°,水走了 63°,可它的彩度全程停在 0.050–0.099——最浅处 0.050、湾中 0.097、最远处 0.069,全图彩度中位数也才 0.074。厚度在这里只改「是哪个颜色」,不改「有多少颜色」。塔拉塔海谷是同一种介质从里面看:那边彩度中位数 0.119,水体自己的彩度还会随深度从 0.122 掉到 0.087。隔着介质看东西,厚度动的是明度和彩度;看介质本身,厚度动的是色相。

连沙滩都没被允许暖起来

对全图做 15°–60° 的搜索,最艳的 3% 只剩 9 个像素、彩度 0.073;橙带占 0.03%,红带 0.01%。岛缘那圈看着发白的沙实测 L 0.78、彩度 0.069、色相 169°,已经站到水那一侧去了。唯一越过这条线的是岛上的黄叶树冠:90°–120° 里最艳的 3% 是 L 0.92、彩度 0.170、色相 106°,比最艳的草地(彩度 0.112)还高半倍。想给一幅以水为主的画留一个焦点,别在水里找——把地和天都收进同一根滑杆,再让一样东西站到滑杆之外。

带走这组颜色

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

/* 碧水原·晴汀 · Bishui Plain, Sunlit Shallows — Teyvat Palette */
:root {
  --sky-blue: oklch(0.81 0.072 237); /* 天青 #95c9ea */
  --haze-pale: oklch(0.93 0.059 208); /* 岚白 #baf4fd */
  --grey-cliff: oklch(0.66 0.082 232); /* 崖岩蓝 #5b9bbc */
  --bay-blue: oklch(0.75 0.097 200); /* 湾中蓝 #57c1c6 */
  --shore-shallow: oklch(0.85 0.05 164); /* 岸浅碧 #b1d9c5 */
  --plain-green: oklch(0.76 0.112 139); /* 原上绿 #8cc27d */
  --ginkgo-crown: oklch(0.92 0.17 106); /* 银杏黄 #f4eb4f */
  --gradient-bishui-plain: linear-gradient(180deg, oklch(0.81 0.072 237) 0%, oklch(0.93 0.059 208) 12%, oklch(0.66 0.082 232) 28%, oklch(0.85 0.05 164) 50%, oklch(0.76 0.112 139) 72%, oklch(0.92 0.17 106) 100%);
}

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

色卡