Teyvat Paletteテイワットパレット
シーンライブラリ
GitHub
ギャラリー
御温泉・照る昼
稲妻昼晴れ晴れうららか春盛り

御温泉・照る昼

Royal Hot Springs in Blazing Daylight

色カード

色をクリックすると HEX をコピー、ホバーで OKLCH 値を表示します。

再構成グラデーション

シーンから蒸留したグラデーションをストップ順に左から右へ展開。完成角度は 180°(ヒーローとエクスポートで使用)、ギャラリーのカードは一律 135° の斜めで表示します。

0%2c6eb016%cb95cf34%74599d56%22416474%632c2c100%a69eab

なぜ調和するのか

空が青いほど絵が濃くなるわけではない。同じ奉行造りの建物、同じ空、同じ桜——ここの天頂の彩度 0.123 は〈天領奉行府・紺の昼〉の 0.087 より半分近く濃いのに、画面全体の彩度中央値はむしろ低く(0.041 対 0.056)、無彩は八ポイント多い(24.98% 対 16.58%)。差はすべて地面にある。まったく同じ矩形で両者の中庭の石畳を測ると、向こうは L 0.42・彩度 0.058・268°、ここは L 0.71・彩度 0.021・311°。絵にどれだけ色があるかは、太陽が地面をどれだけ照らしたかが決めるのであって、空がどれだけ青いかではない。

01

受光側が買うのは明度で、彩度ではない

桜冠を一対の色相窓で測る。270°–315° は 62,369 画素、L 0.52・彩度 0.109。315°–345° は 43,157 画素、L 0.74・彩度 0.102。受光側は 0.22 明るくなり、濃さはむしろ 0.007 減っている。〈天領奉行府・紺の昼〉の同じ一対は 0.117 から 0.100 へ、0.017 の減。明るい絵では「光が当たる」はどちらも明度を足し、彩度を引く操作なのだ——桃はより濃い紫ではなく、より明るく淡い紫である。日向の花を描くなら、先に彩度を落としてから明度を上げること。順序を逆にするとプラスチックになる。

02

同じ石畳、一枚は影に、一枚は日に

まったく同じ矩形 (0.35, 0.86, 0.24, 0.12) で二枚の中庭を測る。画素数はどちらも 26,488。〈天領奉行府・紺の昼〉は L 0.42・彩度 0.058・色相 268°——空が降らせた青である。ここは L 0.71・彩度 0.021・311°、彩度はすでに無彩の閾値 0.025 を下回っている。左の、直射光が正面から当たる白壁はもっと徹底していて L 0.96・彩度 0.025。この絵の無彩画素 24.98% はほぼこうして生まれた。絵師が灰色を敷いたのではなく、太陽が地面の色を洗い流したのだ。

03

空はより青く、絵はより淡く

天頂の実測は L 0.53・彩度 0.123・色相 251°。最も彩度の高い 4000 画素のうち 3288 個が 240°–270° の空、位置 (0.58, 0.13) に落ちている——空はこの絵でいちばん濃い面である。それでも画面全体の彩度中央値は 0.041 しかない。棟の金具も同じ白紙を出す:5,504 画素を 15°–105° で検索して残るのは 5 個、全体の実測は L 0.38・彩度 0.039・250°。絵の濃淡はいちばん濃い一枚に書かれていない、中央値に書かれている。そしてその中央値は受光面積が決める。画面を濃くしたいなら、まず影を与えること。

この配色を持ち帰る

CSS 変数、Tailwind v4 テーマ、または SVG。ワンクリックでプロジェクトへコピーできます。

/* 御温泉・照る昼 · Royal Hot Springs in Blazing Daylight — Teyvat Palette */
:root {
  --zenith-blue: oklch(0.53 0.123 251); /* 天頂の青 #2c6eb0 */
  --sunlit-crown: oklch(0.74 0.102 324); /* 日の桜桃 #cb95cf */
  --shaded-crown: oklch(0.52 0.109 301); /* 陰の桜紫 #74599d */
  --bleached-court: oklch(0.71 0.021 311); /* 晒された石畳 #a69eab */
  --navy-keep: oklch(0.37 0.07 252); /* 湯屋の紺 #224164 */
  --vermilion-rail: oklch(0.37 0.08 22); /* 朱の欄干 #632c2c */
  --gradient-royal-hot-springs: linear-gradient(180deg, oklch(0.53 0.123 251) 0%, oklch(0.74 0.102 324) 16%, oklch(0.52 0.109 301) 34%, oklch(0.37 0.07 252) 56%, oklch(0.37 0.08 22) 74%, oklch(0.71 0.021 311) 100%);
}

1080×1350 の PNG。元の風景・パレット・カラーコードが入っているので、保存してそのまま投稿できます。