Teyvat Palette提瓦特色卡
场景库
GitHub
画廊
帕哈岛·暮霞
挪德卡莱昏瑰丽浩大静谧

帕哈岛·暮霞

Paha Isle at Dusk Glow

色卡

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

重构渐变

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

0%40438d22%684d9345%be689662%f09e9c72%fabb8f100%865a6b

为什么和谐

暗部不掺黑也不掺灰,沿着夕照那条色相弧往紫端退一步就够了:五条色带的明度严格随色相递增——紫 286°/L 0.43、粉 331°/0.51、红 359°/0.60、橙 25°/0.69、黄 60°/0.77——天空自己把「退多少度算暗多少」这把尺画好了,中央那台机械的阴影就在这把尺上取色,全图无彩像素只有 0.72%。

01

天空是一把明度尺

自上而下取样,天空是 278°/L 0.42 → 300°/0.48 → 348°/0.63 → 21°/0.78 → 56°/0.84;按色带统计走的是同一条曲线,五条带合起来 98.23% 的画面(864,850 个像素落在 270°→90° 这半个色轮里)。于是这幅画里没有「亮的紫」,也没有「暗的金」——色相不再是身份,是坐标。〈枫丹廷·午后〉讲过同一件事,但那里的漂移是一个蓝族内部的 35°(220° → 255°),用来救一条深色渐变;这里是整条弧被直接当成明度轴使,连主体的阴影都在弧上取色。

02

机械的阴影在天上取色

画面正中那台伞形机械,壳顶实测 342°/L 0.50/彩度 0.087,绕到背光的右肩色相退成 314°、明度掉到 0.39,彩度几乎没动(0.083);天空在同一段上是 337°/L 0.60 走到 277°/0.42,方向一模一样。一整块占住画面中央的暗体,没有借用一点灰。连它自己发的那圈腹光也还站在弧上:353°、彩度 0.130,全图 0.194 的彩度峰值就落在那儿——它只是把彩度顶高,没有另起一个色相。给物体上阴影,先量环境从亮走到暗那一段转了多少度,再让物体沿同一条弧退得更快一点。

03

看着出弧的两样都在弧里

右上角那座浮岛看上去是湛蓝的,整块实测 282°、L 0.40、彩度 0.111,真正落进蓝带 210°–270° 的只有 463 个像素;它最艳的 3% 是 272°、彩度 0.160,已经越过全图 0.156 的 99 分位——全画最饱和的一处,仍旧站在弧的紫端。右下那片草坡在 90°–165° 的绿窗口里也只找得到 1,484 个像素(101°、彩度 0.064)。真正出弧的只有 1.05%(9,273 个像素,均值 184°、彩度 0.049),而且哪一处都不成其为一件东西。同一座岛的地下那篇把 94.23% 的像素挤进 210°–315°,这里摊开在整整半个色轮上,弧外的比例却同样小。想让一样东西属于这个环境,不必和它同色,只要落在同一条弧上——连最扎眼的那一处都还是自家人。

带走这组颜色

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

/* 帕哈岛·暮霞 · Paha Isle at Dusk Glow — Teyvat Palette */
:root {
  --dusk-zenith: oklch(0.42 0.12 278); /* 暮顶紫 #40438d */
  --afterglow-rose: oklch(0.63 0.122 348); /* 霞粉 #be6896 */
  --horizon-gold: oklch(0.84 0.094 56); /* 落照金 #fabb8f */
  --hull-shade: oklch(0.5 0.087 342); /* 壳影 #854e71 */
  --lee-shoulder: oklch(0.39 0.083 314); /* 背肩紫 #553664 */
  --belly-glow: oklch(0.59 0.13 353); /* 腹光 #b65984 */
  --drift-crystal: oklch(0.43 0.16 272); /* 浮岛晶 #3442a6 */
  --gradient-paha-isle: linear-gradient(180deg, oklch(0.42 0.12 278) 0%, oklch(0.48 0.113 300) 22%, oklch(0.63 0.122 348) 45%, oklch(0.78 0.098 21) 62%, oklch(0.84 0.094 56) 72%, oklch(0.52 0.062 355) 100%);
}

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