蒙德昼明丽恬然花繁

Hexenzirkel's Island in the Sky·花午

Hexenzirkel's Island in the Sky at Flowering Noon

色卡

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

重构渐变

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

0%2e90d540%71c4e768%82ae5c100%9c6494

为什么和谐

两族大面积色相把色轮切开之后,点缀色的座位只有一个:草坡 132° 与天 235° 相隔 103°,短弧的中点是 183.5°,它的正对面 3.5° 到两族各 128.5°;而绿的补色 312° 离天只剩 77°,蓝的补色 55° 离草也只剩 77°。这幅画三个位置全占了——312° 上是紫椅(Cmax 0.154)、56° 上是草间的橙芦苇穗(Cmax 0.155)、3° 上是那把红伞,面积 1.42%,Cmax 0.220,全图天花板。给两个大色配点缀,别找任何一族的补色,找两族等距的那一个点。

伞坐在算得出来的那一度上

全图 345°–15° 只有 12,530 个像素(1.42%),色相 3°;其中 8,896 个落在红伞那个框里,剩下 3,634 个是下半幅花田里的红穗,而整幅画的彩度天花板 0.220 就在伞上。算出来的最优座位是 3.5°,实测 3°。伞下是铺白布的长桌、留声机和几摞摊开的书,除了这把伞,画面里再没有第二样红东西。配色前先量两个大色的色相,取它们短弧的中点再加 180°——那就是强调色该待的地方。

两个补色点上都真有东西,都赢不了

290°–335° 有 8,406 个像素,是长桌两侧那几把高背椅的紫(色相 313°,实测 L 0.45 / C 0.086),Cmax 0.154;35°–75° 有 12,100 个像素,是草里竖起来的橙芦苇穗(色相 56°),Cmax 0.155。橙穗那一撮和红伞的 12,530 几乎一样大,天花板却低了 0.065。补色点的毛病不在离主色不够远,在于它离另一族只有 77°——远离一族的同一步,就贴上了另一族。

1.42% 不是靠彩度额度买下焦点的

全图彩度中位数 0.118、p99 0.148,额度只有 0.030;红伞太小,连 p99 都进不去,它的 0.220 是分位数之外的一撮。〈君王之殿·双照〉里焦点的硬度是色相距离买的——金 66° 离蓝雾 258° 有 168°——但那幅画只有一族要躲,所以「越远越好」成立。两族在场时「越远越好」会把你送到某一族的补色上去,反而只剩 77°;最大距离不是补色,是等距点的 128.5°。

带走这组颜色

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

/* Hexenzirkel's Island in the Sky·花午 · Hexenzirkel's Island in the Sky at Flowering Noon — Teyvat Palette */
:root {
  --deep-sky: oklch(0.63 0.136 244); /* 深天蓝 #2e90d5 */
  --ridge-haze: oklch(0.78 0.095 227); /* 远岭霭 #71c4e7 */
  --hill-green: oklch(0.7 0.121 132); /* 坡草绿 #82ae5c */
  --parasol-crimson: oklch(0.71 0.137 359); /* 伞红 #e57a9f */
  --chair-violet: oklch(0.45 0.086 304); /* 椅背紫 #60487c */
  --reed-amber: oklch(0.7 0.075 56); /* 苇穗橙 #c39371 */
  --cosmos-pink: oklch(0.58 0.097 332); /* 秋樱粉 #9c6494 */
  --gradient-hexenzirkels-island-in-the-sky: linear-gradient(180deg, oklch(0.63 0.136 244) 0%, oklch(0.78 0.095 227) 40%, oklch(0.7 0.121 132) 68%, oklch(0.58 0.097 332) 100%);
}

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

色卡