スメール昼涼しい陰湿り気市井

シャープールホテル・崖の陰

Shapur Hotel in Cliff Shade

色カード

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

再構成グラデーション

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

0%173f1a26%24563c38%4a3c5358%345c67100%2c3c34

なぜ調和するのか

天と地を分けるのに、明度は一銭も払わなくていい:同じ一対の矩形でシャープールホテルの上下縁を測ると、明度は 0.33 対 0.33——まったく同じで、彩度が 0.076 対 0.024。この場所は頭上を苔の岩壁がまるごと覆い、画中に空は一寸も無い。明暗差を生む光がそもそも存在しないのだ。だから差額はすべて彩度に計上され、読み取れるのは「暗い」ではなく「陰」になる。同じ回の〈ウィカラ隊商宿・白い正午〉は、同じ差額をまるごと明度に計上した(上下 0.34 対 0.87)。二枚とも分かれている——分かれることは共通項であり、どんな場所として読まれるかは、どの軸に計上したかが決めている。

上下は同じ明るさ、分けるのは三倍の彩度

背景の苔むした崖面は L 0.33 / 彩度 0.077 / 色相 145°、前景いっぱいの木の桟道は L 0.34 / 彩度 0.025 / 色相 164°。明度差 0.01、色相差 19°、彩度差は 3.1 倍。全画面の明度は p01 の 0.22 から p99 の 0.54 まで、一枚の 720p が 0.32 の明度帯の中だけで生きている。それでも濁らないのは、緑の帯が 56.92% を占めて平均彩度 0.059 なのに対し、前景の木板の 0.025 がちょうど無彩の線を踏んでいるからだ。直射光の無い場所を描くなら、前景を暗く落として階層を作ろうとしないこと。彩度差を三倍まで開き、明度は平らなままにしておく。

明度は敷石一枚にしか貸されていない

全画面の明度中央値は 0.34、そして右手の敷石の広場は L 0.45——画中で中央値をはっきり上回る唯一の面であり、唯一の青でもある:その 16,356 画素の矩形のうち 14,687 画素(89.8%)が 190°–270° に落ち、平均色相 217° / 彩度 0.048。全画面に広げれば 190°–270° は 80,107 画素、218° / 0.050。最も明るい 4000 画素のうち 1,388 画素もこの敷石の上にある(L 0.55 / 彩度 0.058 / 色相 223°)。それでいて、この絵に空の画素は一つも無い。〈万端珊瑚探偵所・日陰の昼〉は同じことの反対端を測っていた——あちらは空が画角の隅に一片だけ残り、影の青が 0.054 / 251°。こちらは空が一画素も無く、影の青は 0.048 / 217°、それでも請求は届いている。明度という軸は使えないのではない、面一枚に貸すぶんしか無いのだ。残りの分離は彩度に計上するほかない。

吊り幟は唯一の他族、しかも大声ではない

軒下に連なる三角の吊り幟は、画中で唯一まとまった非・緑青の色である:全画面の 270°–345° は合計 5,001 画素(0.57%)、平均 L 0.38 / 彩度 0.043 / 色相 313°——緑の帯の 0.059 より彩度が低い。桟道の真ん中に立つ赤衣の旅人はさらに小さく、最も濃い一撮みで L 0.38 / 彩度 0.097 / 色相 17°、全画面の 330°–90° の暖色を合わせても 4,082 画素しかない。81.09% が緑・青緑・青の三帯に落ちる一枚が、この百分の一にも満たない二撮みの他族色だけで「ここで商いが行われている」という意味を持つ。同族色の大きな面にアクセントを置くとき、大声にする必要はない——面積が小さく、色相が唯一であれば足りる。大声にすれば「陰」のほうが消えてしまう。

この配色を持ち帰る

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

/* シャープールホテル・崖の陰 · Shapur Hotel in Cliff Shade — Teyvat Palette */
:root {
  --moss-cliff-green: oklch(0.33 0.077 145); /* 苔崖の緑 #173f1a */
  --shell-roof-teal: oklch(0.41 0.07 158); /* 貝屋根の青緑 #24563c */
  --bunting-violet: oklch(0.38 0.043 313); /* 吊り幟の紫 #4a3c53 */
  --skylit-flagstone: oklch(0.45 0.048 217); /* 天光の敷石 #345c67 */
  --deck-grey: oklch(0.34 0.025 164); /* 桟木の灰 #2c3c34 */
  --gradient-shapur-hotel: linear-gradient(180deg, oklch(0.33 0.077 145) 0%, oklch(0.41 0.07 158) 26%, oklch(0.38 0.043 313) 38%, oklch(0.45 0.048 217) 58%, oklch(0.34 0.025 164) 100%);
}

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