Teyvat Palette提瓦特色卡
场景库
GitHub
画廊
大巴扎·灯荫
须弥幽深熙攘灯暖

大巴扎·灯荫

Grand Bazaar, Lamps in the Shade

色卡

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

重构渐变

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

0%0c1c1718%0e281b48%3d484566%3b2d2584%4f4730100%655635

为什么和谐

一盏灯能不能被看见,取决于它照到的那块面还剩几笔账可改:大巴扎的石板路没有固有色——两处没被灯照到的路面,3,311 和 5,871 个像素,彩度都是 0.015,最大值只有 0.021 和 0.023,连一个越过无彩线 0.025 的像素都没有;而灯柱脚下那块地彩度涨到 0.038、色相从 193° 甩到 92°,明度只从 0.38 走到 0.40。〈舒茨铁铺·炉光〉的地是日光的青,差额只能记在色相上;〈衡准大厅·焰照〉的地本来就是火的暖,只能记在彩度上;这里的地什么都不是,于是两笔一起记。把一条路铺成无彩的,不是为了低调,是为了让每一盏灯都有两条通道可花——而明度那一条,三张画都没有动。

01

路比叶子亮,却更没有颜色

没被灯照到的铺地三处:画面中段 3,311 个像素 L 0.38 / 彩度 0.015、下缘 5,871 个像素 L 0.40 / 0.015、左下角 10,440 个像素 L 0.52 / 0.019——明度跨了 0.14,彩度纹丝不动,前两处的最大值 0.021 与 0.023 干脆没有一个像素越线。而同一幅画左右两片叶丛是 L 0.25 / 0.040 和 L 0.25 / 0.039。所以这条路不是「暗到没有颜色」,它比叶子亮 0.13 到 0.27,反而更没有颜色。判断一块灰是不是材质本身没有色相,别看它多暗——在同一幅画里找一样和它一样亮、甚至更暗的东西,比彩度。

02

灯是两笔账,明度不在其中

灯柱脚下 2,368 个像素 L 0.40 / 彩度 0.038 / 色相 92°,同一条横带上没被照到的那块 3,311 个像素是 L 0.38 / 0.015 / 193°:彩度 2.5 倍、色相甩过 101°、明度只涨 0.02。右下摊子前那块 5,253 个像素 L 0.46 / 0.053 / 86°,对同高度的路面也只多 0.06 的明度。〈舒茨铁铺·炉光〉的同一片铺地日照 194°、棚下 190°、炉口正前 49°,ΔL 全在 0.05 内、ΔC 在 0.005 内——那块地是日光的青,只有色相可换;〈衡准大厅·焰照〉的地本来就是火的暖,色相只走 22°,差额全记彩度。这张补上第三种:地面根本没有固有色时,两笔可以一起记。三种情况里明度一次都没被动过——画灯照到的地,永远不要靠提亮。

03

货没有颜色,颜色全在灯位上

右下那顶看起来鲜红的布篷,13,325 个像素实测 L 0.31 / 彩度 0.026 / 色相 49°,只比无彩线高 0.001,而全图彩度中位数是 0.031——这个市集里最像商品的一块颜色,低于自己这幅画的中位数。整片暖色 330°–90° 只有 71,801 个像素(8.15%),最浓的 3% 也才 0.094。反过来,最亮的 4000 个像素里没有一撮成得了气候:最大的一撮 1,035 个,排在前面的七撮合起来 3,330 个,分落在七个不同的格子里,色相全部关在 69°–96° 的一小段里——那是七摊灯火,不是一个光源。一个卖东西的地方,货品一件都没有自己的颜色,全画的彩度分布就是一张灯位图。想画夜市,别去调货品的饱和度,去摆灯——再把灯要照的那块地铺成没有色相的。

带走这组颜色

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

/* 大巴扎·灯荫 · Grand Bazaar, Lamps in the Shade — Teyvat Palette */
:root {
  --canopy-ink: oklch(0.21 0.024 170); /* 冠盖墨 #0c1c17 */
  --leaf-wall: oklch(0.25 0.04 161); /* 林壁青 #0e281b */
  --awning-red: oklch(0.31 0.026 49); /* 篷影红 #3b2d25 */
  --unlit-paving: oklch(0.39 0.015 178); /* 无灯石 #3d4845 */
  --lamplit-paving: oklch(0.4 0.038 92); /* 灯下石 #4f4730 */
  --stall-glow: oklch(0.46 0.053 86); /* 摊前黄 #655635 */
  --gradient-grand-bazaar: linear-gradient(180deg, oklch(0.21 0.024 170) 0%, oklch(0.25 0.04 161) 18%, oklch(0.39 0.015 178) 48%, oklch(0.31 0.026 49) 66%, oklch(0.4 0.038 92) 84%, oklch(0.46 0.053 86) 100%);
}

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