モンド昼澄明広闊涼やか

シードル湖・澄んだ正午

Cider Lake at Crystal Noon

色カード

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

再構成グラデーション

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

0%3278ba26%8ab4d345%71a7c266%72bdba84%96a581100%9f9665

なぜ調和するのか

奥行きと光源は二枚の地図で、別々のチャンネルに、別々の原点で描ける——画面の上端から手前の岸まで、等高の七本の帯の色相は 248° → 143° へ単調に進み、一度も引き返さない。ところが明度は地平線を軸に折り返す:天頂 0.59、地平線のすぐ上 0.75、足元 0.59 と、両端がぴたりと一致する。色相が記すのは「水をどれだけ通ったか」、明度が記すのは「あの明るい線からどれだけ離れているか」。二つの事柄を同じチャンネルに重ねないこと。

明度は地平線で折り返す

画面を等高の八本に切ると、明度は順に 0.59 / 0.71 / 0.75 / 0.69 / 0.68 / 0.71 / 0.71 / 0.59。最も暗い二本は片方が天頂、もう片方がレンズのすぐ手前で、数値は完全に同じ。最も明るい 0.75 は地平線のすぐ上に挟まっている。〈列柱砂原・白い靄〉が測ったのも同じ折り返しだ——光源が地平線という一本の線に伸びると、勾配はその線で折れる。違うのは、あちらでは彩度も一緒に折れること。ここでは折れない:上へ 0.064 → 0.118 と上がり、下へ 0.070 → 0.057 と落ちる。この絵で明度が答えているのは一つだけ、あの明るい線からどれだけ離れているか。

あの 151° は道であって、衝突ではない

面積を持つ色相帯は四本、平均 88° / 130° / 188° / 239°。一段ずつ隣り合って 151° を埋め、合わせて画面の 96.40% になる。多色相の喧嘩に聞こえるが、実際にはどれも同じ高さには現れない:天頂 250°、地平線 231°、水面 192°、水中の砂底 126°、水面から出た砂浜 99°。最も離れた両端は、一方が画面の上縁、もう一方が下縁に貼りついていて、隣り合うことがない。色相というチャンネルが丸ごと奥行きに使われている——それがこの絵に無彩の地を必要としない理由でもある。全画の無彩はわずか 3.55%。

あの金の砂に暖色は一画素もない

水線より下、画面右下のあの砂洲は金色に見えるが、実測は色相 126°、彩度 0.054。330°–90° という 120° 幅の窓を同じ矩形にかけると、18966 画素のうち一致したのは 6 個だけだった。全画の赤帯(345°–15°)も 0.02% しかなく、下半分で 45°–90° に落ちる画素は平均 88° までしか届かない。金に読めるのは、そこがあの色相の道の終点だからである。だからチャンネルを割り当てる前に測ること——「何色に見えるか」は、どのチャンネルがどの地図を描くかを決められない。

この配色を持ち帰る

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

/* シードル湖・澄んだ正午 · Cider Lake at Crystal Noon — Teyvat Palette */
:root {
  --zenith-blue: oklch(0.56 0.124 250); /* 天頂の青 #3278ba */
  --cumulus-white: oklch(0.97 0.01 216); /* 積雲の白 #eef7f9 */
  --horizon-blue: oklch(0.7 0.069 231); /* 地平の青 #71a7c2 */
  --lake-teal: oklch(0.75 0.075 192); /* 湖面の青 #72bdba */
  --sandbed-green: oklch(0.7 0.054 126); /* 砂底の緑 #96a581 */
  --shoal-gold: oklch(0.67 0.068 99); /* 洲の金 #9f9665 */
  --cliff-shadow: oklch(0.59 0.067 246); /* 崖影の青 #5c81a3 */
  --gradient-cider-lake: linear-gradient(180deg, oklch(0.56 0.124 250) 0%, oklch(0.75 0.064 242) 26%, oklch(0.7 0.069 231) 45%, oklch(0.75 0.075 192) 66%, oklch(0.7 0.054 126) 84%, oklch(0.67 0.068 99) 100%);
}

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