
Chouji's House in Bright Daylight
点击色块复制 HEX;悬停查看 OKLCH 值。
从场景蒸馏出的渐变,按停靠点从左到右展开;成品角度 180°(hero 与导出使用),画廊卡片统一以 135° 斜向展示。
换一个色相,浓度就不必用明度买:这幅画 90°–165° 最浓的 3% 绿在 L 0.70 上是彩度 0.155,同一张画的 210°–270° 最浓的 3% 蓝要跌到 L 0.62 才有 0.124——绿又亮 0.08 又浓 0.031。所以它明度中位数在四张里第二高(0.68),彩度上限却是白昼三张里最高的(0.195)。蓝紫的浓度要拿明度换,青绿不用;一个色板浓不浓,先看它把主色押在了色轮的哪一边。
CSS 变量、Tailwind v4 主题或 SVG,一键复制到你的项目。
/* Chouji's House·朗昼 · Chouji's House in Bright Daylight — Teyvat Palette */
:root {
--meadow-green: oklch(0.68 0.138 155); /* 草绿 #42b172 */
--thatch-straw: oklch(0.73 0.068 88); /* 苫金 #baa676 */
--cliff-teal: oklch(0.54 0.072 185); /* 崖青 #367c74 */
--sky-blue: oklch(0.75 0.097 235); /* 天蓝 #6db8e3 */
--far-haze: oklch(0.76 0.087 216); /* 远霭白 #6bbfd4 */
--step-stone: oklch(0.68 0.042 119); /* 阶石青 #959c7f */
--gradient-choujis-house: linear-gradient(180deg, oklch(0.75 0.097 235) 0%, oklch(0.76 0.087 216) 14%, oklch(0.54 0.072 185) 34%, oklch(0.73 0.068 88) 52%, oklch(0.68 0.042 119) 72%, oklch(0.68 0.138 155) 100%);
}1080×1350 的 PNG,原图、色卡与色值都在里面——存下来直接发。