Teyvat Paletteテイワットパレット
シーンライブラリ
GitHub
ギャラリー
ウィカラ隊商宿・白い正午
スメール昼日照り端正がらんとした

ウィカラ隊商宿・白い正午

Wikala Funduq at White Noon

色カード

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

再構成グラデーション

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

0%2c513d14%365b5130%21634c48%a3d89f70%d4da5a100%d2d7c7

なぜ調和するのか

上下を明度で分けるには、両端を先に同じ色相の族へ収めておく必要がある:同じ一対の矩形でウィカラ隊商宿の上下縁を測ると、明度は 0.34 対 0.87——差は 0.53、そして色相 158° 対 123° はともに緑青の一族、彩度 0.043 対 0.023 はどちらも低い。全画面の 120°–180° の緑青帯だけで 610,777 画素を食べ、下縁の石の地のあの矩形は最も濃い 3% でも彩度 0.030 にしかならない。色相と彩度が揃って道を譲るからこそ、その 0.53 は「日の光が石に落ちている」と読まれ、「素材が変わった」とは読まれない。同じ回の〈シャープールホテル・崖の陰〉は、この差額をまるごと彩度に計上した(上下とも明度 0.33)。二枚とも分かれている——分かれることは共通項であり、どんな場所として読まれるかは、どの軸に計上したかが決めている。

01

同じ壁、日照りが買うのは明度だけ

画面右半の、太陽に打たれた瓦壁は実測 L 0.83 / 彩度 0.096 / 色相 143°。左半の、光を背にした同じ種類の瓦壁は L 0.45 / 彩度 0.076 / 色相 167°。明度差 0.38、彩度差はわずか 0.020、色相は 24°。この絵では直射光がほぼ明度という一本の通路しか通っていない。そして 120°–180° の緑青帯は合計 610,777 画素、平均 L 0.44 / 彩度 0.057——画面の大半が同じ釉薬瓦であり、それが明暗の二つに切られることで、左右対称の構図に左と右が生まれる。強い日差しを表したいなら、ついでに彩度を上げないこと。明度差を 0.38 まで作り、彩度差を 0.02 以内に留めれば、光に見える。二缶のペンキには見えない。

02

地面に立場が無いから、明度の一筆が澄む

下縁のあの石の地は L 0.87 / 彩度 0.021 / 色相 121°。最も濃い 3% でも 0.030、最大値は 0.042——地面まるごとが無彩の線 0.025 の付近に押さえられている。全画面の彩度中央値は 0.045 だから、地面はその半分だ。地面が色相の立場を持たないからこそ、上縁の瓦屋根との間にある 0.53 の明度差はどの色相にも邪魔されず、「同じ光の下の二段」として読まれる。逆に考えればいい:この地面にも釉薬がかかっていたら、0.53 はたちまち二種類の素材の対峙に変わる。明度で空間を語りたいなら、まず最も大きな面を一つ選び、その色相を空にしておくこと。

03

一畝の黄花が天井を突く、しかも族は変えていない

中央の一畝の黄花は、全画面で最も彩度の高い一撮みである:最も濃い 3% で実測 L 0.86 / 彩度 0.151 / 色相 112°、全画面の彩度最大値 0.194 も緑の帯に落ちている。そして本当の暖色——330°–90° というあの窓ひとつ分——は全画面で 1,582 画素しかない(census では橙 0.03% に黄 0.15%)。黄花に見えて実測は 112°、まだ緑と黄のあいだにあり、主色族から一歩も出ていない。効いているのは、L 0.87 の白い石の地の上に座っていることのほうだ。それで左右対称の構図の真ん中になった。これが明度の一筆を澄ませたあとの配当である:下地が素であるほど、一撮みの高彩度は面積を必要とせず、新しい色相さえ必要としない。

この配色を持ち帰る

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

/* ウィカラ隊商宿・白い正午 · Wikala Funduq at White Noon — Teyvat Palette */
:root {
  --eave-deep-green: oklch(0.4 0.054 159); /* 軒の深緑 #2c513d */
  --arch-pillar-stone: oklch(0.44 0.046 174); /* 拱柱の石青 #365b51 */
  --shaded-tile-teal: oklch(0.45 0.076 167); /* 陰の瓦青 #21634c */
  --sunlit-tile-green: oklch(0.83 0.096 143); /* 日照りの瓦緑 #a3d89f */
  --flowerbed-yellow: oklch(0.86 0.151 112); /* 花壇の若黄 #d4da5a */
  --sunbleached-flagstone: oklch(0.87 0.021 121); /* 灼けた白石の地 #d2d7c7 */
  --gradient-wikala-funduq: linear-gradient(180deg, oklch(0.4 0.054 159) 0%, oklch(0.44 0.046 174) 14%, oklch(0.45 0.076 167) 30%, oklch(0.83 0.096 143) 48%, oklch(0.86 0.151 112) 70%, oklch(0.87 0.021 121) 100%);
}

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