璃月昼清朗素净闲坐

九略茶馆·天光

Jiulue Teahouse under Plain Daylight

色卡

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

重构渐变

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

0%599cba18%6d9c9c44%4b575f62%a8424c100%bfc7bc

为什么和谐

建成的东西一律不着色:占画面下半 45% 的石阶与铺地彩度只有 0.019,整块茶馆建筑 0.020,全图 56.13% 的像素在无彩阈值以下——颜色全交给会变的东西,天(229°)、绝壁(195°)和庭心那一株红枫(17°、彩度 0.134)。彩度只发给会变的部分,不变的那部分留白,这个地方才可能被重新布置。

建筑没有自己的色号

左半幅那整块茶馆——青瓦顶、木廊、白粉墙——均值彩度 0.020,已经在 0.025 的无彩阈值以下。把它最彩的 3% 单独取出来,均值也不过 229°、彩度 0.089,而 229° 正是它头顶那片天的色相(彩度 0.082)。建筑连仅有的那点颜色都是借天的,自己一个色号也没出。想让一个空间经得起反复布置,先让它自己不说话。

一株枫扛下全部彩度

全图最彩的 4000 个像素里有 3697 个落在同一处:庭心 (0.51, 0.43) 那株红枫,均值 17°、彩度 0.134,峰值 0.197 是整幅画的最高点。第二暖的东西是一株橙树(35°、彩度 0.102),被顶在右画框最外侧 (0.98, 0.32) 上,几乎要出画。暖色一共只占 5.71%,却是这张画里唯一记得住的颜色——因为它脚下那片铺地亮到 L 0.82 仍然彩度 0.018,全图最亮的 4000 个像素(L 0.90)也全在石板上,彩度 0.016。最亮的面不带颜色,最彩的东西才有地方站。

留白是为了以后能上色

同一间茶馆的海灯节版本证明了这块留白的用处:无彩像素从 56.13% 掉到 25.82%,同一片下半幅地面彩度从 0.019 升到 0.032,它最彩的 3% 从 252° 的冷影翻成 33° 的灯火。地是空的,节才上得去。做产品同理——框架、容器、分隔一律无彩,把彩度的额度留给会换的那部分内容,换季换活动换主题时才不必重画一遍壳。

带走这组颜色

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

/* 九略茶馆·天光 · Jiulue Teahouse under Plain Daylight — Teyvat Palette */
:root {
  --open-sky: oklch(0.66 0.082 229); /* 天光蓝 #599cba */
  --karst-teal: oklch(0.66 0.051 195); /* 岩青 #6d9c9c */
  --court-stone: oklch(0.82 0.018 137); /* 石庭白 #bfc7bc */
  --eave-slate: oklch(0.45 0.02 239); /* 檐灰 #4b575f */
  --maple-red: oklch(0.52 0.134 17); /* 枫红 #a8424c */
  --rim-orange: oklch(0.54 0.102 35); /* 边缘橙 #a15745 */
  --gradient-jiulue-teahouse: linear-gradient(180deg, oklch(0.66 0.082 229) 0%, oklch(0.66 0.051 195) 18%, oklch(0.45 0.02 239) 44%, oklch(0.52 0.134 17) 62%, oklch(0.82 0.018 137) 100%);
}

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

色卡