Teyvat Palette提瓦特色卡
场景库
GitHub
画廊
桓那兰那·绿昼
须弥昼生机梦境葱茏

桓那兰那·绿昼

Vanarana, Green Noon

色卡

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

重构渐变

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

0%7eb6e222%7acbe650%80cf63100%3c9335

为什么和谐

不用灰的和谐:龙脊雪山靠 63% 的灰调解三色,这里灰只有 5.9%、94% 全是彩色却不乱——条件是色相收成相邻两族,再把彩度分出一倍的主从。

01

两族相邻,彩度主从

绿(142°)占 56.9%、C 0.133 拿旋律;青蓝(214°–243°)占 36.2%、C 0.069 拿伴奏。色相只有两族且相邻,彩度差一倍——没有灰也不打架,这两个条件缺一不可;对照龙脊雪山那篇:色相一多,就得请灰当调解人。

02

同一片绿靠明度分层

受光叶 L 0.78、背光叶 L 0.59,色相几乎不动(138° 对 142°)。大面积单色相的层次全靠明度——和渊下宫的雾同一条定律,只是那边彩度归零,这边是饱和的绿。

03

梦境感来自越界的饱和

绿的峰值彩度 0.24,现实里的植物很少这么饱和——桓那兰那是梦之国,美术故意把绿推过写实线。想要「超现实但不刺眼」:只推主族的彩度,辅族(这里的天空青)按住不动,越界才有参照物。

带走这组颜色

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

/* 桓那兰那·绿昼 · Vanarana, Green Noon — Teyvat Palette */
:root {
  --dream-leaf: oklch(0.78 0.163 138.4); /* 梦叶绿 #7fcf64 */
  --leaf-shade: oklch(0.59 0.156 141.8); /* 荫绿 #3d9334 */
  --sky-cyan: oklch(0.754 0.087 242.8); /* 晴空青 #7eb6e2 */
  --mist-tree: oklch(0.8 0.088 221.3); /* 雾树青 #7acbe6 */
  --path-tan: oklch(0.7 0.059 87); /* 沙径褐 #ae9d74 */
  --gradient-vanarana: linear-gradient(180deg, oklch(0.754 0.087 243) 0%, oklch(0.8 0.088 221) 22%, oklch(0.78 0.163 138) 50%, oklch(0.59 0.156 142) 100%);
}

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