モンド夕温もり静けさ暮れ方

冒険者協会(モンド)・宵の灯

Adventurers' Guild Mondstadt at Lamplit Dusk

色カード

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

再構成グラデーション

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

0%366a8314%cf7f3e30%8a735a46%ad616478%8c9a5b100%697c7d

なぜ調和するのか

灰色は塗るものではない、二つの色温度が同じ面の上で打ち消し合った結果である。この絵の 32.30% の画素は無彩の閾値より下にあり、その最大の面——カウンター前の石畳の広場——は実測で彩度 0.022、色相 201°。暖かい灯りの 57° と宵空の 231° のちょうど間に挟まっている。中性の面が欲しいなら、灰を調色するのではなく、向きの逆な二つの光を与えること。

広場は二つの光の平均値

カウンター正面の石畳(画面下辺の中ほど)は実測 L 0.57、彩度 0.022、色相 201°。頭上の宵空は L 0.50、彩度 0.069、色相 231°、右上の灯った窓の最も鮮やかな 3% は L 0.67、彩度 0.127、色相 57°。201° は 57° から 231° へ向かう弧の上にちょうど乗り、彩度は両側から薄められて 0.022——無彩の閾値 0.025 を下回る。この地面は灰に調色されたのではなく、二つの色に打ち消されて灰になった。

片方の光しか受けない面は、色が残る

左の城壁は宵空だけを向いていて、実測 L 0.33、彩度 0.032、色相 241°——青がそのまま残る。右のハーフティンバーの壁面は灯りだけを受け、L 0.57、彩度 0.046、色相 69° で黄もそのまま。画面の黄の帯 34.86% はこの灯りに染まった壁のことで、平均彩度は 0.059。灯り自体は窓のいくつかの点で 0.127 しかない。打ち消しは二つの光を同時に受ける面の上でしか起きない。インターフェースに本当の中性面を置きたいなら、パレットの中から灰を探すのではなく、二つの光源の境目にそれを置くこと。

灰が買い戻したのは、あの 9.34% の緑

広場の三つのプランター。90°〜165° の画素だけを取り出すと 26745 個、平均 L 0.66、彩度 0.088、色相 119°、ピーク 0.198——それが全画面の彩度の上限そのものだ。緑の帯は 9.34% しかないのに最も響く一段を握り、34.86% を占める黄の帯の平均は 0.059 に過ぎない。32.30% の無彩の広場がその前提である。同じ四枚の冒険者協会のうち、稲妻の一枚は無彩が 8.09% しか残っておらず、彩度のピーク 0.231 を引き立てる静かな隣人がもういない。彩度の上限を取っていいのは面積の小さい一族だけ——ただし先に地を敷いてあれば、の話だ。

この配色を持ち帰る

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

/* 冒険者協会(モンド)・宵の灯 · Adventurers' Guild Mondstadt at Lamplit Dusk — Teyvat Palette */
:root {
  --night-sky: oklch(0.5 0.069 231); /* 宵空の青 #366a83 */
  --window-gold: oklch(0.67 0.127 57); /* 窓灯りの金 #cf7f3e */
  --timber-cream: oklch(0.57 0.046 69); /* ハーフティンバーの黄 #8a735a */
  --canopy-rose: oklch(0.58 0.099 18); /* 天幕の緋 #ad6164 */
  --plaza-grey: oklch(0.57 0.022 201); /* 広場の灰 #697c7d */
  --planter-green: oklch(0.66 0.088 119); /* プランターの緑 #8c9a5b */
  --gradient-adventurers-guild-mondstadt: linear-gradient(180deg, oklch(0.5 0.069 231) 0%, oklch(0.67 0.127 57) 14%, oklch(0.57 0.046 69) 30%, oklch(0.58 0.099 18) 46%, oklch(0.66 0.088 119) 78%, oklch(0.57 0.022 201) 100%);
}

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