Teyvat Palette提瓦特色卡
场景库
GitHub
画廊
月荡海·夜潮
挪德卡莱夜幽暗辉光开阔

月荡海·夜潮

Moontide Sea after Dark

色卡

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

重构渐变

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

0%03071234%111c4144%38a9ea100%0d76f7

为什么和谐

想让一条线成为画面的主角,就让明度和彩度在同一条线上一起跳:地平线之上实测 L 0.13、彩度 0.026,之下 L 0.70、彩度 0.137——明度差 0.57,彩度差 5.3 倍,同一条边界上两个通道一起断开。

01

断开只用了画面高度的 10%

上半幅(顶端 20% 的取样)L 0.13、彩度 0.026;下半幅海面(55%–90%)L 0.70、彩度 0.137。夹在中间的只有一条约占画高 6% 的雾带,实测 L 0.24、彩度 0.073——它不是渐变,是一级台阶。跨过这条线,明度涨 0.57、彩度涨到 5.3 倍,于是眼睛把地平线当成画面的主语,而不是把海和天当成两块颜色。这与无想刃狭间那一篇正好互补:那里的 L/C 暴力跳变发生在时间上(闪与不闪),这里发生在空间上(线上与线下)。

02

上半幅不是深蓝,是黑

全图 76.1% 的像素落在蓝带(均值 254°),看上去是一幅「蓝色的画」;但夜空那一块的彩度只有 0.026,已经压在灰阈值上,全图 10.74% 的无彩像素几乎都在这里。颜色被整体押到了水线以下。这是夜景省钱的办法:天空不需要真的是蓝的,它只要暗到让下面那点彩度显得奢侈。

03

一个暖色像素都没有

对整幅画做 330°–90° 的暖色搜索,符合灰阈值的像素**一个都没有**。左下那几道看着像金沙浅滩的亮痕,实测是 L 0.90、彩度 0.048、色相 152° 的淡青——全图最亮的 3300 个像素就聚在那里 (0.10, 0.88),平均 L 0.91 而彩度只有 0.039。而彩度峰值 0.212 落在画面中部的海沟 (0.58, 0.66),L 0.59。最亮的地方和最艳的地方是两处:一处给光,一处给色。

带走这组颜色

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

/* 月荡海·夜潮 · Moontide Sea after Dark — Teyvat Palette */
:root {
  --night-vault: oklch(0.13 0.026 263); /* 夜穹黑 #030712 */
  --haze-violet: oklch(0.24 0.073 268); /* 霾紫 #111c41 */
  --moontide-blue: oklch(0.7 0.137 239); /* 潮蓝 #38a9ea */
  --deep-tide: oklch(0.59 0.212 258); /* 深潮 #0d76f7 */
  --shoal-white: oklch(0.9 0.048 152); /* 汐白 #c7e8cf */
  --dawn-pink: oklch(0.77 0.098 317); /* 曦粉 #cea1de */
  --gradient-moontide-sea: linear-gradient(180deg, oklch(0.13 0.026 263) 0%, oklch(0.24 0.073 268) 34%, oklch(0.7 0.137 239) 44%, oklch(0.59 0.212 258) 100%);
}

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