Teyvat Palette提瓦特色卡
场景库
GitHub
画廊
精石铜城·尘金
须弥幽阔暖尘机巧

精石铜城·尘金

Madinat al-Nuhas in Golden Dust

色卡

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

重构渐变

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

0%0f0e1420%1d1e2c42%e5b65f62%57432c100%987743

为什么和谐

上下之间的差额可以三笔一起记,但那等于宣布上下不属于同一个光:同一对矩形量精石铜城的上下缘,明度 0.20 对 0.53、彩度 0.015 对 0.075、色相 274° 对 76°——三根轴全部拧到底,换来的却不是「分得更开」,是把天换成了盖子。画面最上那条 10% 高的岩顶,92,160 个像素里没有一个越过无彩线,彩度最大值只有 0.024;整个 150°–330° 的冷半边色轮,全图只剩 1,448 个像素。同一批的〈宝商街·漏晴〉只花一笔色相就把上下分开了(两端彩度 0.052 对 0.060),那张有天,这张没有——三笔全花买到的不是分离的强度,是「这里没有出口」。

01

冷是明度冒充的

全图 150°–330° 的冷半边只有 1,448 个像素,均值彩度 0.026、最大 0.052——刚刚踩在无彩阈值 0.025 上,而它看起来是一整片幽蓝的洞顶。上缘那条 10% 高的岩带 92,160 个像素,彩度最大值 0.024,一个都没越线。暖的那一半倒是实打实:15°–105° 有 404,297 个像素,均值 L 0.47 / 彩度 0.060 / 色相 71°。三笔一起记的代价正在这里——色相那一笔花到 162° 之后,顶上那块面已经没有色相可用了,它只能靠低明度说话,而观众替它把「冷」补上。想画一个冷的暗部,先试试完全不给它色相;旁边那一大片暖会替你冷。

02

光不在东西上,在空气里

这座洞城真正被照亮的实体很少:下缘那座六边形圆台 L 0.59 / 彩度 0.081 / 色相 77°,最亮的 3% 到 L 0.84 / 0.119 / 88°;而它上方左右两片什么也没有的尘霾,一片 L 0.42 / 0.049 / 68°,一片 L 0.36 / 0.040 / 71°——全图彩度中位数只有 0.020,尘霾是它的两倍多,黄带一带就吃掉 44.77% 的画面。〈千壑沙地·风沙〉说过环境的颜色一半是空气的;这张更极端:上下那 162° 的色相差没有一件实体承担,承担它的是尘霾的 0.045 和一块几乎没有色相的岩顶 0.012。想让一个空间显得有光在流动,别把彩度全发给灯本身,发给灯和眼睛之间那段空气。

03

三笔全花,买的是「没有天」

同一对矩形放到同批另外三张上:沙普尔旅舍上下明度都是 0.33,只差彩度 0.076 对 0.024;宝商街上下彩度 0.052 对 0.060,只差色相 159° 对 233°;维卡拉商栈上下色相 158° 对 123° 同族,只差明度 0.34 对 0.87。三张都分得开,而且分得干净。精石铜城三笔一起花,得到的不是更强的分离——0.33 的明度差还不如维卡拉的 0.53——而是一次语义上的转变:上面那块面不再被读作天,它被读作盖子。反过来用:想让一个空间有出口,只在一根轴上分开天与地;想让它封闭,把三根一起拧到底。

带走这组颜色

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

/* 精石铜城·尘金 · Madinat al-Nuhas in Golden Dust — Teyvat Palette */
:root {
  --rock-lid-violet: oklch(0.17 0.012 293); /* 岩盖紫 #0f0e14 */
  --remote-violet: oklch(0.24 0.026 280); /* 远影紫 #1d1e2c */
  --clockwork-gold: oklch(0.8 0.118 81); /* 机关金 #e5b65f */
  --dust-haze-gold: oklch(0.4 0.045 70); /* 尘霾金 #57432c */
  --lamplit-terrace: oklch(0.59 0.081 77); /* 灯照石台 #987743 */
  --gradient-madinat-al-nuhas: linear-gradient(180deg, oklch(0.17 0.012 293) 0%, oklch(0.24 0.026 280) 20%, oklch(0.8 0.118 81) 42%, oklch(0.4 0.045 70) 62%, oklch(0.59 0.081 77) 100%);
}

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