モンド昼明朗のどか花盛り

魔女会の空島・花の正午

Hexenzirkel's Island in the Sky at Flowering Noon

色カード

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

再構成グラデーション

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

0%2e90d540%71c4e768%82ae5c100%9c6494

なぜ調和するのか

二つの大面積の色相が色相環を切り分けたあと、アクセントの座席は一つしかない:草の斜面 132° と空 235° は 103° 離れ、短いほうの弧の中点は 183.5°、その真向かいの 3.5° は両族からそれぞれ 128.5°。いっぽう緑の補色 312° は空まで 77° しかなく、青の補色 55° も草まで 77° しかない。この絵は三つの位置をすべて埋めている——312° には紫の椅子(Cmax 0.154)、56° には草間の橙の葦穂(Cmax 0.155)、そして 3° にあの紅い傘、面積 1.42%、Cmax 0.220、画面の天井。二つの大きな色にアクセントを添えるなら、どちらの補色でもなく、両族から等距離のその一点を探すこと。

傘は計算で出る一度に座っている

画面全体の 345°–15° はわずか 12,530 ピクセル(1.42%)、色相 3°。うち 8,896 個が紅い傘の枠に落ち、残る 3,634 個は下半分の花畑の紅い穂だ。そして画面の彩度の天井 0.220 は傘の上にある。計算上の最適座席は 3.5°、実測 3°。傘の下には白布を掛けた長机、蓄音機、積み上げた本——この傘のほかに紅いものは画面に一つもない。配色の前に二つの大きな色の色相を測り、短いほうの弧の中点に 180° を足すこと。アクセントが座るべきなのはそこだ。

補色の二点にはどちらも実物があり、どちらも勝てない

290°–335° には 8,406 ピクセル、長机の両脇に並ぶ背の高い椅子の紫(色相 313°、実測 L 0.45 / C 0.086)、Cmax 0.154。35°–75° には 12,100 ピクセル、草の中に立ち上がる橙の葦穂(色相 56°)、Cmax 0.155。葦穂のひとかたまりは紅い傘の 12,530 とほぼ同じ大きさなのに、天井は 0.065 低い。補色の弱点は主色から遠くないことではなく、もう一方の族まで 77° しかないことだ——一方から離れるその同じ一歩で、もう一方に貼りついてしまう。

1.42% は彩度の余力で焦点を買ったのではない

画面の彩度中央値は 0.118、p99 は 0.148、余力はわずか 0.030。紅い傘は小さすぎて p99 にすら入らず、その 0.220 は分位数の外側のひとかたまりである。〈アル・ムアザン宮殿・二つの灯〉では焦点の硬さを色相距離が買っていた——金 66° は青い霧 258° から 168° 離れている——が、あの絵は避けるべき族が一つだけだったので「遠いほどよい」が成り立った。二族が居るとき「遠いほどよい」はどちらかの補色へ連れて行き、結局 77° しか残らない。最大距離は補色ではなく、等距離点の 128.5° である。

この配色を持ち帰る

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

/* 魔女会の空島・花の正午 · Hexenzirkel's Island in the Sky at Flowering Noon — Teyvat Palette */
:root {
  --deep-sky: oklch(0.63 0.136 244); /* 深天の青 #2e90d5 */
  --ridge-haze: oklch(0.78 0.095 227); /* 遠嶺の靄 #71c4e7 */
  --hill-green: oklch(0.7 0.121 132); /* 丘草の緑 #82ae5c */
  --parasol-crimson: oklch(0.71 0.137 359); /* 傘の紅 #e57a9f */
  --chair-violet: oklch(0.45 0.086 304); /* 椅子背の紫 #60487c */
  --reed-amber: oklch(0.7 0.075 56); /* 葦穂の橙 #c39371 */
  --cosmos-pink: oklch(0.58 0.097 332); /* コスモスの桃 #9c6494 */
  --gradient-hexenzirkels-island-in-the-sky: linear-gradient(180deg, oklch(0.63 0.136 244) 0%, oklch(0.78 0.095 227) 40%, oklch(0.7 0.121 132) 68%, oklch(0.58 0.097 332) 100%);
}

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