Teyvat Paletteテイワットパレット
シーンライブラリ
GitHub
ギャラリー
ファロス灯台・晴れの雲
スメール昼軽快潮の香悠々

ファロス灯台・晴れの雲

Pharos Lighthouse under Fair-Weather Clouds

色カード

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

再構成グラデーション

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

0%defcfd18%4888c252%adf2fe68%76bd6a100%2866b1

なぜ調和するのか

灰に代価があるかどうかは、それが奥行きの何層目に立っているかで決まる。ファロス灯台の無彩 4.53% はほぼすべて雲の上にある——最も明るい 4000 画素は一つも水平線より下に落ちず、3298 個が最上段の区画に詰まっていて、L 0.97 / 彩度 0.031 / 色相 198°–203°。白くて大きな面でありながら、彩度の天井は一分も奪っていない:全画面のピークは 0.176 で、屋外のあの定数帯(〈アビディアの森・雨上がりの晴れ〉0.165、〈アシャヴァンレルム・霧の深み〉0.188)の中にとどまり、しかもそれは近くの樹冠と深い水のものだ。大きな中性面が欲しく、なおかつ画面全体を褪せさせたくないなら、それをすべての実体の後ろへ置くこと。

01

最も白いものが最後の層に立っている

最も明るい 4000 画素のうち 3298 個が最上段の三区画にあり(重心は (0.13, 0.03) と (0.29, 0.02))、L 0.97 / 彩度 0.031 / 色相 198°–203°——上半分を埋める積雲だ。残る 702 個も左側の同じ雲の上にあり、水平線を越えたものは一つもない。それは奥行きの最後の層に並び、目との間で何も遮らない。だからこの 4.53% の無彩はただで手に入っている:面積は買ったが、彩度は買っていない。中性面を敷く前に、それが何の前に立つのかを問うこと——何も遮らない中性面は代金を取らない。

02

天井は近くの二つの面が山分けする。一方は受光、一方は影の中

最も濃い 4000 画素は二つの塊に分かれる:2144 個が 120°–150°、L 0.73 / 彩度 0.135、重心 (0.59, 0.48)——灯台の右に覆いかぶさる樹冠。1514 個が 240°–270°、L 0.51 / 彩度 0.134、重心 (0.40, 0.63)——桟橋の左に広がる深い水。両者の明度差は 0.22、彩度差はわずか 0.001。彩度の頂点は「最も明るく照らされた面」への褒賞ではなく、奥行き上の位置がもつ性質だ。どちらも近くにあるから、どちらも 0.176 に手が届く。

03

雲のほかに、この絵に灰は一つもない

無彩は 4.53% しかなく、残りはどれも自分の色相を握っている:雲間の空は 248°、左手の陽に灼かれた遠い海面は 209° / 彩度 0.070、緑に見える灯台の円蓋は実測 188°——実は青碧で、樹冠の 141° とは 47° 離れている。島に生えるあの珊瑚色の椰子の冠は全画面で唯一の暖色で、345°–15° が 0.03%、315°–345° が 0.01%。椰子の矩形だけを 330°–30° で探しても、最も濃い 3% は 9 画素、彩度 0.072 にすぎない。中性面が最も遠い層に一度きりで回収されているから、その手前では一区画も譲る必要がない。彩度の高い絵に中性を置くなら、撒かないこと——最も遠い層に集めれば、一枚で全部が足りる。

この配色を持ち帰る

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

/* ファロス灯台・晴れの雲 · Pharos Lighthouse under Fair-Weather Clouds — Teyvat Palette */
:root {
  --island-canopy: oklch(0.73 0.135 141); /* 島冠の緑 #76bd6a */
  --pier-shadow-blue: oklch(0.51 0.134 255); /* 橋影の青 #2866b1 */
  --dome-cyan: oklch(0.62 0.079 188); /* 円蓋の青碧 #46968f */
  --zenith-blue: oklch(0.61 0.111 248); /* 天頂の青 #4888c2 */
  --horizon-sea: oklch(0.92 0.07 209); /* 遠海の霽 #adf2fe */
  --cumulus-white: oklch(0.97 0.031 200); /* 積雲の白 #defcfd */
  --gradient-pharos-lighthouse: linear-gradient(180deg, oklch(0.97 0.031 200) 0%, oklch(0.61 0.111 248) 18%, oklch(0.92 0.07 209) 52%, oklch(0.73 0.135 141) 68%, oklch(0.51 0.134 255) 100%);
}

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