蒙德昼熙攘晴亮轻快

蒙德城·节午

Mondstadt at Windblume Noon

色卡

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

重构渐变

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

0%765d7014%36618834%c0cac356%b6ae9074%5d884e88%985528100%e2cb9d

为什么和谐

节庆的颜色有租面积和租额度两种花法,而能不能花第一种由光决定:夜里的灰是没被照到的面,一盏灯就能重刷一遍(九略茶馆无彩 56.13% → 25.82%,330°–60° 从 37,096 个像素涨到 195,140 个),正午的灰是被太阳占着的面,同样挂满装饰的蒙德广场无彩还剩 33.62%、330°–60° 只有 19,539 个像素,彩度中位数 0.039 反而比灯夜的 0.045 更低——这场节只买得起额度,0.144 减 0.039 是 0.105,高过灯夜的 0.092。

灰一分都没花出去

全图 33.62% 的像素彩度低于 0.025,彩度中位数只有 0.039;最亮的 4,000 个像素里 3,192 个彩度落在 0.010 到 0.017、明度 0.92 到 0.93,全是那片被晒到的铺地(取一块实测 L 0.83、彩度 0.015、色相 154°,17,630 个像素,整块压在无彩线下)。〈九略茶馆·灯夜〉那场节花掉了 30 个百分点的灰,这一场一个百分点都没花:它的灰不是「没被照到」,是「正被太阳照着」,而被照着的中性面没法靠再加一盏灯改写。

最大的那幅幡最不出声

横过街面那幅粉幡 6,075 个像素,实测 L 0.51、彩度 0.044、色相 335°,只比全图彩度中位数 0.039 高出 0.005——画面里体量最大的一件装饰,响度几乎就是平均值。0.178 的天花板反而归左上台阶那盏自己发蓝光的风花灯:灯头 1,089 个像素就顶到 0.178,它脚下被蓝光罩住的那圈石头彩度 0.079,是全图蓝带均值 0.045 的 1.8 倍。白昼里,只有会自己发光的装饰买得起天花板。

买不到面积,就全买响度

330°–60° 全画只有 19,539 个像素,可这一撮最浓的 3% 是 L 0.60、彩度 0.131;插在绿篱里的橙纸风车在这个窗口内只有 653 个像素,均值 0.106、峰值 0.166——653 个像素就摸到了 0.178 的天花板。灯夜的额度是 0.137 减 0.045 等于 0.092,这里是 0.144 减 0.039 等于 0.105——面积一寸没买,响度反而更高。白天的界面做节日皮肤同理:底色被日光占着,别指望改它;把预算押在少数几个自己会发光的点上,不发光的装饰再大也只是覆盖。

带走这组颜色

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

/* 蒙德城·节午 · Mondstadt at Windblume Noon — Teyvat Palette */
:root {
  --flagstone-grey: oklch(0.83 0.015 154); /* 铺地灰 #c0cac3 */
  --court-brick: oklch(0.75 0.042 94); /* 场心砖 #b6ae90 */
  --hedge-green: oklch(0.58 0.097 138); /* 篱绿 #5d884e */
  --border-bloom: oklch(0.85 0.066 85); /* 花坛黄 #e2cb9d */
  --street-banner: oklch(0.51 0.044 335); /* 幡粉 #765d70 */
  --paper-pinwheel: oklch(0.52 0.106 52); /* 纸风车橙 #985528 */
  --windblume-lamp: oklch(0.48 0.079 247); /* 风花灯蓝 #366188 */
  --gradient-mondstadt-main-plaza-windblume: linear-gradient(168deg, oklch(0.51 0.044 335) 0%, oklch(0.48 0.079 247) 14%, oklch(0.83 0.015 154) 34%, oklch(0.75 0.042 94) 56%, oklch(0.58 0.097 138) 74%, oklch(0.52 0.106 52) 88%, oklch(0.85 0.066 85) 100%);
}

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

色卡