フォンテーヌ昼軽やか端正のどか

レシュッツのクロックワーク工房・陽と翳

Leschots Clockwork Workshop in Sun and Shade

色カード

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

再構成グラデーション

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

0%fbf8f614%c89cb130%22908248%376a6e62%c15d5d78%aa8984100%535365

なぜ調和するのか

二束目の光は色相の保険である。ここには向きの相反する光が同時に二束、ひとつは無色、ひとつは有色でかかっている:右上で飛んだ直射の面(最も明るい 4,000 画素のうち 3,973 画素が同じ一区画に集まり、明度 0.99、彩度 0.002)と、左の塔の翳に落ちた空光(明度 0.45、彩度 0.028、色相 285°)。結果、八本の色相帯すべてが 1% を越え、`300°–360°` に 33,648 画素——同じ街の水仙十字結社のわずか 23 画素の 1,463 倍にあたる。色板の一族一族を見分けさせたいなら、色板をいじるのではなく、色温度の違う二つ目の光源を足すこと。

桃色は本当に桃色、紅は本当に紅

右手の露店にかかる桃色の天幕は、`300°–360°` の窓の中に 11,336 画素を独占し、色相 348°、彩度 0.060。壁龕に立つ機械人形の紅い裙は最も鮮やかな 3% が 22°、彩度 0.129、ピーク 0.149。同じフォンテーヌの室内に置かれた同じ紅い布でも、〈「公爵」の執務室・緑の翳〉のあの紅ビロードの椅子は実測 49°、〈水仙十字結社・光の柱〉の二本の桃色の幟は 38° と 23° だった——ここでは紅は紅のまま、桃色は桃色のままでいられている。

二束の光が互いの帳尻を消す

太陽のほうは無色だ:飛んだ壁の彩度はわずか 0.004。空光のほうは紫青で、左の塔の翳は 285°、彩度 0.028、紫の帯はそのおかげで 9.75% を占める。一方はすべての受光面を中性へ押し、もう一方はすべての背光面を 285° へ押すので、どちらも画面を独り占めできない。画面の彩度中央値は 0.033 しかなく、緑の翳のあの部屋の 0.029 とほとんど変わらない——騒がしくないのは色が淡いからではなく、二束の光が打ち消し合っているからだ。

八本の色相帯、ひとつも潰れていない

紅 2.42%、橙 10.19%、黄 8.88%、緑 1.93%、青緑 9.24%、青 17.85%、紫 9.75%、桃 1.32%——八本すべてが 1% を越える。一方、緑の翳のあの部屋に残るのは二本だけだ(黄 20.47%、緑 43.06%)。差は物の数ではない。どちらも塗料と布でいっぱいの部屋であり、街角だ。差は、ここでは一族ごとに代弁してくれる光があることにある。配色をどういじっても画面が一枚の塊に読めてしまうときは、色をいじる前に光源が何個あるかを見に行くこと。

この配色を持ち帰る

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

/* レシュッツのクロックワーク工房・陽と翳 · Leschots Clockwork Workshop in Sun and Shade — Teyvat Palette */
:root {
  --awning-rose: oklch(0.74 0.06 348); /* 天幕の緋 #c89cb1 */
  --blown-white: oklch(0.98 0.004 43); /* 飛んだ白 #fbf8f6 */
  --shadow-violet: oklch(0.45 0.028 285); /* 翳の紫 #535365 */
  --doll-red: oklch(0.6 0.129 22); /* 人形の紅 #c15d5d */
  --cypress-teal: oklch(0.59 0.097 182); /* 糸杉の青緑 #229082 */
  --window-teal: oklch(0.49 0.055 203); /* 窓の青緑 #376a6e */
  --brick-ochre: oklch(0.66 0.041 29); /* 煉瓦の赭 #aa8984 */
  --gradient-leschots-clockwork-workshop: linear-gradient(215deg, oklch(0.98 0.004 43) 0%, oklch(0.74 0.06 348) 14%, oklch(0.59 0.097 182) 30%, oklch(0.49 0.055 203) 48%, oklch(0.6 0.129 22) 62%, oklch(0.66 0.041 29) 78%, oklch(0.45 0.028 285) 100%);
}

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