Teyvat Palette提瓦特色卡
场景库
GitHub
画廊
逐浪野·崖阴
挪德卡莱昼峻峭清凉明快

逐浪野·崖阴

Wavechaser Plain in the Cliff's Shade

色卡

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

重构渐变

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

0%5e9be418%71799545%2c395b64%71799584%99af67100%5a8abc

为什么和谐

色相是留给「换了材料」的,不是留给「换了亮度」的:同一面崖上,那张洞口只动明度(L 0.58 → 0.35),色相只走 6°(273° → 267°);崖与天之间只动彩度(0.044 → 0.126,2.9 倍),色相只走 19°——210°–315° 一族里装下了岩、洞影、天、水四样东西,占住 77.18% 的画面,谁也不会被认错。全画唯一真的换了色相的边是崖脚那条草线,153°(275° → 122°),也是唯一一条两边真是两种材料的边。

01

洞口只欠明度

崖面受光的那一大片实测 273°、L 0.58、彩度 0.044;崖腰上那张张开的洞口 267°、L 0.35、彩度 0.063。明度掉了 0.23,色相只差 6°——全图明度 1 分位是 0.25,画里最暗的那一片就在这张口里,而中位数是 0.61。它读起来是「同一块岩没被照到的地方」而不是一块黑漆,原因就是除了明度它什么都没改(彩度还涨了 0.019,因为背光面只剩那片 0.126 的天在照它)。

02

天只欠彩度

右上那角天实测 254°、L 0.68、彩度 0.126,是全画最艳的一块大面;它和崖面的明度只差 0.10、色相只差 19°,彩度却是 2.9 倍。同一族继续往下装:右侧远处的山与霾 249°、L 0.76、彩度 0.103,右下漫上岸的海水 251°、L 0.62、彩度 0.093。蓝带 52.35% 加紫带 24.83% 是 77.18% 的画面,岩、天、霾、水四样东西挤在同一族色相里,分开它们的从来不是色相。

03

唯一换色相的边,是唯一换材料的边

崖脚那条草地是绿带 18.35%,实测 122°、彩度 0.106、L 0.71,对崖的 275°、0.052、0.56——153°,全画最大的一次色相跨越,也是唯一一条两边真是两种东西(石头与活着的地面)的边。比它更小的例外是礁石上那面红幡:315°–45° 全画只有 191 个像素、0.02%,而它实测 20°、彩度 0.155、峰值 0.173,就是这幅画的彩度天花板。做界面同理——同一个组件的状态只动明度,层级只动彩度,一动色相就等于告诉人「这是另一类东西」;一条边只欠一样,三根通道一起拧,层级就读不出来了。

带走这组颜色

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

/* 逐浪野·崖阴 · Wavechaser Plain in the Cliff's Shade — Teyvat Palette */
:root {
  --cliff-face: oklch(0.58 0.044 273); /* 崖面 #717995 */
  --cave-mouth: oklch(0.35 0.063 267); /* 洞影 #2c395b */
  --zenith-blue: oklch(0.68 0.126 254); /* 天顶蓝 #5e9be4 */
  --far-peaks: oklch(0.76 0.103 249); /* 远峰霭 #7cb6f0 */
  --shore-water: oklch(0.62 0.093 251); /* 岸水 #5a8abc */
  --foot-meadow: oklch(0.72 0.1 123); /* 崖脚草 #99af67 */
  --banner-red: oklch(0.49 0.155 20); /* 幡红 #a62f3a */
  --gradient-lunar-treasury-wavechaser-plain-location-context: linear-gradient(180deg, oklch(0.68 0.126 254) 0%, oklch(0.58 0.044 273) 18%, oklch(0.35 0.063 267) 45%, oklch(0.58 0.044 273) 64%, oklch(0.72 0.1 123) 84%, oklch(0.62 0.093 251) 100%);
}

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