Teyvat Palette提瓦特色卡
场景库
GitHub
画廊
连芳茶点·淡晴
璃月昼清淡敞亮素朴

连芳茶点·淡晴

Lianfang Dim Sum under a Pale Sun

色卡

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

重构渐变

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

0%b2b7a620%5c8b7e40%44596255%514d4168%5d314e82%995338100%949884

为什么和谐

「彩度全发给会变的东西」有个前提:那样东西得站在光里。这条街上唯一的植物是右缘只露出一角的红叶树,它在背阴处(L 0.38 / 彩度 0.075 / 341°,峰值 0.136),于是全图的天花板 0.140 被柜台上几只陶壶捡走了——同批那两张有受光植物的璃月白昼是 0.216 与 0.184,而它们画里的人造朱红最高只到 0.107。想抬一幅街景的彩度上限,别给建筑加饱和度(它加不上去),把那棵树挪到太阳底下。

01

灰一格也排不准

同一批三张璃月白昼,明度中位数 0.58 / 0.62 / 0.58 只差 0.04,无彩却是 17.14% / 33.03% / 62.42%,差 3.6 倍;而彩度天花板是 0.216 / 0.140 / 0.184——灰最多的那张比灰最少的那张低,灰居中的这一张最低。这条队按灰怎么排都不单调。这幅画自己的 33.03% 也不解释任何事:彩度中位数 0.032,而 90°–165° 那 33.24% 听着像满眼的绿,实测均值彩度只有 0.034——它全是浅青灰的石板与白墙,不是植物。

02

建成的东西挤在 0.02 到 0.03

同一轮日光下,这条街每一块大面积的面都关在同一档彩度里:前庭铺地 (0.35, 0.68) L 0.67 / 彩度 0.029 / 115°,左侧白粉墙 (0.02, 0.16) L 0.77 / 0.024 / 119°,门脸的格窗与梁柱 (0.30, 0.40) L 0.42 / 0.020 / 91°——木头压在 0.025 的无彩线以下,右侧退进去的檐下 (0.75, 0.28) L 0.45 / 0.029 / 226°。连画面正中那幅比人还高、被当成招牌立在路当中的青绿布幡,也只有 L 0.60 / 彩度 0.056 / 175°。〈九略茶馆·天光〉把这件事写成过一条规矩:建成的东西一律不着色,彩度全发给会变的东西。

03

那样东西得站在光里

这幅画的问题是,那件会变的东西被安排在背阴里:画框右缘只露出一角的红叶树,那块 4,437 个像素的矩形实测 L 0.38 / 彩度 0.075 / 341°,峰值 0.136。于是 0.140 的天花板落到一件建成物身上——柜台上那几只陶壶,最艳的 3% 是 L 0.52 / 彩度 0.101 / 42°,而全图 330°–60° 的暖色一共只有 24,643 个像素(2.67%)。对照同批:〈春茗茶坊·翠昼〉画左那片受光的茶园草坡最艳 3% 到 0.161(L 0.72),〈Sword and Strongbox Secure Transport Agency·晒白〉右上角越过屋脊那棵晒着太阳的树到 0.162(L 0.74)。做场景配色时,上限不是调出来的,是安排出来的:那棵树一退进阴影,整幅画的上限就掉回建成物的高度。

带走这组颜色

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

/* 连芳茶点·淡晴 · Lianfang Dim Sum under a Pale Sun — Teyvat Palette */
:root {
  --banner-teal: oklch(0.6 0.056 175); /* 幡青 #5c8b7e */
  --whitewash: oklch(0.77 0.024 119); /* 粉墙白 #b2b7a6 */
  --courtyard-flagstone: oklch(0.67 0.029 115); /* 前庭石 #949884 */
  --shopfront-wood: oklch(0.42 0.02 91); /* 门脸木 #514d41 */
  --clay-pot: oklch(0.52 0.101 42); /* 陶壶橙 #995338 */
  --eave-shadow: oklch(0.45 0.029 226); /* 檐影蓝 #445962 */
  --edge-maple: oklch(0.38 0.075 341); /* 边角红 #5d314e */
  --gradient-lianfang-dim-sum: linear-gradient(180deg, oklch(0.77 0.024 119) 0%, oklch(0.6 0.056 175) 20%, oklch(0.45 0.029 226) 40%, oklch(0.42 0.02 91) 55%, oklch(0.38 0.075 341) 68%, oklch(0.52 0.101 42) 82%, oklch(0.67 0.029 115) 100%);
}

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