Teyvat Palette提瓦特色卡
场景库
GitHub
画廊
苍风高地·晴穹
蒙德昼舒朗高远丰饶

苍风高地·晴穹

Windwail Highland under a Clear Zenith

色卡

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

重构渐变

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

0%3191d124%aee9ff52%94be9178%488592100%34587c

为什么和谐

取景框不必是四条边,一条就够——但它必须在一根轴上单独走开:上缘 15% 的彩度 0.121 对中心的 0.073(1.66 倍),而其余三缘的 0.073 / 0.075 / 0.086 全部贴着中心不动;同一条上缘的明度是 0.69,比中心的 0.70 还低一点。框是彩度画出来的,和亮暗没有关系。

01

彩度全押在最上面那一条

全画彩度最高的 4000 个像素里有 3855 个落在 240°–270°,位置 (0.34, 0.01)——画框顶边正中的那片天顶。横切成十条量下来,最上两条是 0.129 和 0.098,剩下八条全部挤进 0.067–0.079 这 0.012 宽的带子里;上两角 0.124 与 0.107,下两角和中心是 0.073 / 0.073 / 0.073,三块几乎一模一样。彩度不是从上往下渐变掉的,是在上缘之下一步踏平的。要给一块内容加边框,先选定一根轴,把差额整份押在那一根上,别三根轴各动一点。

02

上缘比中心还暗一点

上缘那条 L 0.69,中心 0.70——框在明度上什么也没说;四条边的明度 0.69 / 0.59 / 0.72 / 0.61 骑跨在中心两侧,连符号都不一致。因为明度另有工作:左下那面近处崖壁 L 0.45,而左侧远处城郭所在的雾带 L 0.80,整条纵深都挂在这根轴上。一根轴一次只干得了一件事;要画框,就得去找一根还空着的。

03

金黄的秋树其实是绿的

〈龙脊雪山·秋雪〉画框用的是色相——11.6% 的暖像素全站在四缘。这张没有这个选项:红、橙、黄三条带加起来只有 0.27%。台地边缘那一排看着金黄的秋树,把它们所在的横带里 45°–165° 的像素取出来实测 134°、彩度 0.065,真正落进 45°–90° 的只有 609 个;画面正中那栋红瓦庄园是全图唯一的人造暖色,屋顶那一小块里落在 330°–90° 暖窗的只有 166 个像素,均值 353°、彩度 0.055,比全画的彩度中位数 0.077 还低。动手画框之前先清点一遍:哪几根轴上你真的有存货。

带走这组颜色

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

/* 苍风高地·晴穹 · Windwail Highland under a Clear Zenith — Teyvat Palette */
:root {
  --zenith-blue: oklch(0.63 0.131 243); /* 穹顶蓝 #3191d1 */
  --horizon-haze: oklch(0.9 0.067 223); /* 远雾白 #aee9ff */
  --town-in-haze: oklch(0.8 0.097 231); /* 城影蓝 #79c9f1 */
  --terrace-green: oklch(0.76 0.078 143); /* 台地绿 #94be91 */
  --near-cliff: oklch(0.45 0.073 250); /* 崖壁青灰 #34587c */
  --manor-red: oklch(0.67 0.055 353); /* 庄园红 #b18898 */
  --gradient-windwail-highland: linear-gradient(180deg, oklch(0.63 0.131 243) 0%, oklch(0.9 0.067 223) 24%, oklch(0.76 0.078 143) 52%, oklch(0.58 0.066 214) 78%, oklch(0.45 0.073 250) 100%);
}

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