
Thalatta Submarine Canyon under Descending Light
点击色块复制 HEX;悬停查看 OKLCH 值。
从场景蒸馏出的渐变,按停靠点从左到右展开;成品角度 165°(hero 与导出使用),画廊卡片统一以 135° 斜向展示。
介质变暗会连彩度一起交出去,材质变暗只交明度:从水面往海床走,水体明度 0.80 掉到 0.51、彩度跟着 0.122 掉到 0.087,而同一批水草彩度纹丝不动(0.147 → 0.143),只把明度从 0.74 交到 0.53——最深处水草与水的明度差只剩 0.02,彩度差却涨到 0.056。背景是介质的时候,对比不用你加,它自己会长。
CSS 变量、Tailwind v4 主题或 SVG,一键复制到你的项目。
/* 塔拉塔海谷·垂光 · Thalatta Submarine Canyon under Descending Light — Teyvat Palette */
:root {
--shaft-white: oklch(0.94 0.044 172); /* 束光白 #cff5e8 */
--upper-water: oklch(0.8 0.122 208); /* 上层水 #42d3e7 */
--canyon-wall: oklch(0.54 0.084 209); /* 壁岩青 #207c89 */
--deep-water: oklch(0.51 0.087 211); /* 深层水 #077382 */
--weed-carpet: oklch(0.59 0.14 142); /* 藻毯绿 #46913f */
--kelp-crown: oklch(0.74 0.197 134); /* 昆布梢黄 #73c429 */
--gradient-thalatta-submarine-canyon: linear-gradient(165deg, oklch(0.94 0.044 172) 0%, oklch(0.8 0.122 208) 18%, oklch(0.54 0.084 209) 46%, oklch(0.51 0.087 211) 72%, oklch(0.59 0.14 142) 100%);
}1080×1350 的 PNG,原图、色卡与色值都在里面——存下来直接发。