枫丹昼优雅理性澄澈

枫丹廷·午后

Court of Fontaine at Noon

色卡

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

重构渐变

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

0%d7e8ee30%92cee760%5aa8d4100%2e5e9a

为什么和谐

蓝色单色系 + 金色点缀的『贵气』公式;蓝随明度下降缓缓向紫偏移(220° → 255°),所以往深处走的是『深度』,而不是『变黑』。

色相跟着明度走

从天顶到深水,hue 220° 缓移到 255°。同一 hue 直接压暗容易发脏;做深色渐变时给色相一点漂移,深处就有了『水下』的纵深感。

金蓝互补的克制用法

鎏金(85°)与蓝接近互补,却只出现在建筑装饰线上——面积小、明度又与主色相近,所以是『贵』而不是『艳』。互补色想高级,先对齐明度。

情绪由明度基调决定

整体明度重心在 0.7 以上,是亮调场景——法庭之城的理性与秩序感,先由『亮』定调,色相只是补充说明。同一组色相压暗后,情绪会完全不同。

带走这组颜色

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

/* 枫丹廷·午后 · Court of Fontaine at Noon — Teyvat Palette */
:root {
  --cloud-white: oklch(0.94 0.015 220); /* 云白 #e1eef2 */
  --azure-sky: oklch(0.82 0.07 225); /* 天青 #92cee7 */
  --fountain-blue: oklch(0.68 0.11 235); /* 泉水蓝 #4aa3d2 */
  --gilded-brass: oklch(0.72 0.11 85); /* 鎏金 #c49f4d */
  --deep-sea: oklch(0.45 0.1 255); /* 深海蓝 #2b568b */
  --gradient-fontaine-court-noon: linear-gradient(185deg, oklch(0.92 0.02 220) 0%, oklch(0.82 0.07 225) 30%, oklch(0.7 0.1 235) 60%, oklch(0.48 0.11 255) 100%);
}

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