Teyvat Palette提瓦特色卡
场景库
GitHub
画廊
明星斋·正午
璃月昼端正市井沉稳

明星斋·正午

Mingxing Jewelry at High Noon

色卡

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

重构渐变

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

0%3b394222%59283646%46623170%8a7d4c100%c6cbb0

为什么和谐

让无彩色去搭骨架,颜色就能只负责身份:这幅画 42.7% 的像素低于灰阈值、彩度中位数只有 0.032,明度骨架由 L 0.83 的石板街面撑起——于是朱红柱和它旁边的店内阴影可以同处 L 0.35,只靠彩度(0.074 对 0.017)分开。

01

同一个明度,靠彩度分身份

左侧立柱实测 L 0.35、彩度 0.074、色相 4°;店堂深处的阴影 L 0.35、彩度 0.017。两者明度完全相同,把画面转成灰度它们就会糊成一块——但眼睛完全不会认错,因为一个有颜色、一个没有。这与颠倒古城那一篇是同一条规则的两种用法:那里是明度跨度只剩 12 个百分点、彩度被迫接管;这里明度跨度有 0.25–0.90 那么宽,只是在这两块面上主动交给了彩度。

02

灰不是没有颜色,是让出位置

全图 42.7% 的像素在灰阈值以下,彩度中位数 0.032——而这些灰几乎全是石板街面和粉墙:最亮的 4000 个像素平均 L 0.91、彩度 0.017,位置在 (0.49, 0.96)、(0.67, 0.95),就是画面下缘的地面。街面把明度的上限占住了,朱红(17.3% 的红橙带)因此不必为了显眼去争亮度。想让品牌色安静地醒目,先给它铺一片够大够亮的无彩面。

03

两株枫是唯一的活物,彩度也最高

最饱和的 4000 个像素平均 L 0.70、彩度 0.149、色相 132°,落在 (0.52, 0.56)——门前那两盆枫。它们只占绿带 14.5%,却是全画彩度峰值,比朱柱最艳处(L 0.56、彩度 0.145、22°)还高一点点。建筑色是既定的词汇:朱红、青灰、匾金都由制式决定,画面里唯一能自由生长的东西于是分到了最高的彩度。

带走这组颜色

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

/* 明星斋·正午 · Mingxing Jewelry at High Noon — Teyvat Palette */
:root {
  --eave-shadow: oklch(0.35 0.017 298); /* 檐下影 #3b3942 */
  --vermilion-post: oklch(0.35 0.074 4); /* 朱柱 #592836 */
  --potted-maple: oklch(0.46 0.08 133); /* 盆枫绿 #466231 */
  --signboard-gold: oklch(0.59 0.069 95); /* 匾金 #8a7d4c */
  --flagstone: oklch(0.83 0.037 115); /* 石板白 #c6cbb0 */
  --gradient-mingxing-jewelry: linear-gradient(350deg, oklch(0.35 0.017 298) 0%, oklch(0.35 0.074 4) 22%, oklch(0.46 0.08 133) 46%, oklch(0.59 0.069 95) 70%, oklch(0.83 0.037 115) 100%);
}

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