纳塔昼轻快开阔假日

Easybreeze Holiday Resort·浮晴

Easybreeze Holiday Resort in Floating Clarity

色卡

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

重构渐变

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

0%1d74d022%3f93cf42%adeefc56%8ae0f778%5db2b3100%6bb35f

为什么和谐

底子浓的时候,主体最省的做法是三条通道一起往下让:那艘飞舟实测 L 0.52、彩度 0.080、色相 234°,紧挨它两侧的天是 L 0.66 / 0.114 / 241° 与 L 0.63 / 0.121 / 243°——同一族,暗 0.11 与 0.14,彩度只有它们的六成六与七成。在一幅无彩仅 4.85%、彩度中位数 0.096 的画里,浓是空气和地面的属性,交出彩度的那一块反而成了唯一读得出的实体。

主体两个极值一个都不占

最艳的 4000 个像素里,2,738 个在右下那道近处草坡(120°–150°,均值彩度 0.193,重心 (0.67, 0.79)),1,256 个在天顶那一角(240°–270°,0.185,重心 (0.11, 0.03));最亮的 4000 个,报得出的七格全是云,彩度 0.009–0.022。飞舟一个也没拿到,它拿的是「比紧挨着的背景更淡」这一件事——0.080 对 0.114 与 0.121,而且左右各量一次数字几乎对称,不是取景造出来的假象。画面里最强的两处颜色一个在最上缘、一个在最下缘,主体安安静静坐在中间。

淡不是让位,是「不是空气」

〈诸界秘展之厅·星霞〉那一篇说让位靠淡:铺地比主体亮 0.12、彩度只有四成(0.044 对 0.109),分离一点没松(数字引自该篇)。这里最淡的那块大面恰恰是主体。区别在于彩度归谁:那幅画的彩度长在东西上,这幅画的彩度长在空气和草上——天顶 0.162、近草坡 0.139(绿带峰值 0.267),而从云带到远海整条中景只有 0.051–0.094。一片浓的空气里,交出彩度就等于宣布自己不是空气。所以淡定的不是主次,是材质归属:先量清楚彩度归环境还是归实体,再决定主体该往上走还是往下让。

看着最艳的那条路,只有 533 个像素

右侧草坡上盘着一条彩绘小径,看着是橙黄的。对整幅画做 330°–60° 的暖色搜索只有 1,019 个像素(0.12%);把矩形收到那条路上、只取 30°–90°,更是只剩 533 个、均值彩度 0.097,而同一个矩形里落在 90°–180° 的有 16,412 个、均值 0.134。这条「橙路」的绝大部分其实是比周围更黄一点的绿——正是〈埃尔顿海沟·幽昼〉那条「暖是画框里的名次」在一片 141° 的草上的样子。所以在配色里引用一条「暖色路径」之前先量它,别信它。

带走这组颜色

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

/* Easybreeze Holiday Resort·浮晴 · Easybreeze Holiday Resort in Floating Clarity — Teyvat Palette */
:root {
  --zenith-blue: oklch(0.56 0.162 254); /* 天顶蓝 #1d74d0 */
  --mid-sky: oklch(0.64 0.121 243); /* 中天蓝 #3f93cf */
  --airship-teal: oklch(0.52 0.08 234); /* 舟身青 #347090 */
  --far-sea: oklch(0.86 0.089 217); /* 远海白 #8ae0f7 */
  --cloud-white: oklch(0.98 0.012 157); /* 积云白 #f2fbf5 */
  --meadow-green: oklch(0.7 0.139 141); /* 草坡绿 #6bb35f */
  --painted-path: oklch(0.69 0.097 67); /* 彩径黄 #c48f57 */
  --gradient-easybreeze-holiday-resort: linear-gradient(180deg, oklch(0.56 0.162 254) 0%, oklch(0.64 0.121 243) 22%, oklch(0.91 0.068 213) 42%, oklch(0.86 0.089 217) 56%, oklch(0.71 0.082 197) 78%, oklch(0.7 0.139 141) 100%);
}

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

色卡