蒙德夜沉静守夜温存

晨曦酒庄·夜窗

Dawn Winery, Lit Windows at Night

色卡

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

重构渐变

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

0%1b325820%333d5438%41586b52%9c7f7268%53765284%e2b163100%5883a0

为什么和谐

夜不是把颜色调暗,是只没收和它对立的那一族:同一把尺子下,白昼的蒙德城树 140°、岩与城墙 191°、红瓦 49°,入夜的晨曦酒庄树 136°、岩 192°–198°,红瓦却走到了 267°–273°,右塔那面屋顶在 330°–90° 的整个暖色窗口里返回 nothing matched——而它的明度 0.37 只比全图中位数 0.41 低 0.04。要画夜,别整体降饱和度:把与主光对立的那一族整族改嫁到主光的色相上,想留住哪一点对立色,就得给它一个自己的开口。

红瓦不是红的了

三面屋顶实测 267°、273°、257°,和头顶夜空的 260° 同一族;右塔那面在 330°–90° 里返回 nothing matched,左塔那面 3,080 个像素里只剩 11 个落在暖色窗口内,2,801 个落在 210°–315°。可它们的明度是 0.36 到 0.39,离全图 0.41 的中位数不到 0.05——夜没有把屋顶压黑,是把它的姓改了。作为对照,同一把 bench 尺子量白昼的蒙德城,同一种红瓦顶是 49°、彩度 0.061,3,903 个像素。蒙德的身份色在这一夜整个不在场。

树一分都没交

同一张夜景里,左侧那片松与藤实测 136°、彩度 0.068,全图绿带均值 144°、彩度 0.069;白昼蒙德城的树是 140°、彩度 0.072——色相只挪了 4°,彩度几乎没动。岩石同理:白昼 191°,今夜左侧 198°、右侧 192°。而最艳的 4,000 个像素里 3,635 个正是这些树(L 0.62 / 彩度 0.129 / 139°),峰值 0.166 就是全图天花板。夜空在 260°:树离它 120°、岩离它 69°、红瓦离它 149°,被没收的偏偏是最远的那一族。

剩下的暖色全在开口后面

全画 330°–90° 只有 18,282 个像素:房子那条带(y 0.25–0.70)占 13,258 个,两盏提灯所在的下缘占 4,917 个,夜空那条带只有 107 个。最浓的 3% 是 L 0.79、彩度 0.112、78°,就是两盏灯的芯(左 68°、右 56°,亮到 L 0.85–0.86,越过全图 0.72 的明度 p99);二楼三扇亮窗 44°,楼下两扇 3° 与 19°,被门灯照到的木门 28°。反过来,画面下缘那片看着发暖的沙路在 330°–90° 里返回 nothing matched,实测 190°,左下角的草也只是 170°。想在夜里保住一个暖色,不是把它调亮,是给它一个开口。

带走这组颜色

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

/* 晨曦酒庄·夜窗 · Dawn Winery, Lit Windows at Night — Teyvat Palette */
:root {
  --night-sky: oklch(0.32 0.074 260); /* 夜空蓝 #1b3258 */
  --roof-at-night: oklch(0.36 0.042 267); /* 瓦顶紫 #333d54 */
  --plaster-wall: oklch(0.45 0.042 243); /* 灰泥壁 #41586b */
  --night-foliage: oklch(0.53 0.069 144); /* 夜叶绿 #537652 */
  --forecourt-stone: oklch(0.59 0.065 238); /* 前庭石 #5883a0 */
  --lit-window: oklch(0.62 0.041 44); /* 窗火 #9c7f72 */
  --lantern-core: oklch(0.79 0.112 78); /* 廊灯芯 #e2b163 */
  --gradient-winery-exterior: linear-gradient(180deg, oklch(0.32 0.074 260) 0%, oklch(0.36 0.042 267) 20%, oklch(0.45 0.042 243) 38%, oklch(0.62 0.041 44) 52%, oklch(0.53 0.069 144) 68%, oklch(0.79 0.112 78) 84%, oklch(0.59 0.065 238) 100%);
}

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

色卡