Teyvat Paletteテイワットパレット
シーンライブラリ
GitHub
ギャラリー
アシャヴァンレルム・霧の深み
スメール昼幽深湿り静謐

アシャヴァンレルム・霧の深み

Ashavan Realm, Deep in the Mist

色カード

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

再構成グラデーション

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

0%75c1f226%50a0c655%378fab82%519f73100%c2d43d

なぜ調和するのか

空気遠近法は必ずしも勾配ではない——一段の敷居でも足りる。アシャヴァンレルムは、いちばん手前の梢からいちばん遠い稜線まで五箇所を測って 222°、224°、226°、219°、238°——画面全体の奥行きがわずか 19° の中で揺れているだけで、段にすらなっていない。「遠さ」はすべて画枠の下縁の一歩が払っている:あの草の帯は 157°、左下隅は 139°、一歩で 65° を跨ぐ。〈スメールシティ・青の昼〉は五本の等高帯で 230°→192° と 38° の勾配を単調に歩き切ったが、アシャヴァンレルムは勾配ごと省き、参照物だけを残した。遠近は比べて分かるもので、数えて分かるものではない。

01

梢にも丘にも、緑の画素が一つも無い

手前のあの二つの梢——(0.28, 0.58) からと (0.60, 0.60) から——は実測 222° と 224°、90°–165° の緑の窓ではそれぞれ零画素を返す。奥の草の丘(0.40, 0.24 から)は 226°、これも零画素。右手の草の斜面は 219°、最上縁の遠稜は 238°。巨樹の生い茂る雨林でありながら、画中で「緑」と読めるものはすべて 219°–238° というこの 19° の青に落ちている。全画面の本当の緑は 65675 画素・7.13%、そのうち 59122 個——きっかり九割——が画面下縁 16% のあの一本に詰まっており、その帯より上には全画面で 6553 画素しか残らない。

02

一歩 65° が、画面全体の奥行きを買う

下縁の草の帯(0.28, 0.86 から)は実測 157°、左下隅の陽を受けた低木は 143°、緑の窓だけを取り出せば 139° / 彩度 0.122 で、全画面のピーク 0.188 もこの隅にある——最も濃い 4000 画素のうち 3663 個が 90°–120° に落ち、重心は (0.08, 0.97)。すぐ上の梢の 222° との間に移行は無く、一刀両断だ:上はすべて空気の色相、下はこの土地自身の色相。そして最も明るい 4000 画素のうち 3961 個は最上縁にあり、L 0.93 / 彩度 0.055 / 214°。近と遠が極値を一つずつ取れば、あいだの 19° はもう何も説明しなくてよい。

03

無彩 0.08%——霧は灰ではない

同じ物差し(bench の C<0.025)で測ると、〈ドラゴンスパイン・秋の雪〉は 39.47%、〈風唸りの丘・晴れと松の陰〉は 8.83%、〈珉林・雲白〉は 6.25%、アシャヴァンレルムは 0.08%——最少のものよりさらに八十分の一近い。しかもこの絵は端から端まで霧に埋まっている。その霧は実測 色相 231° / 彩度 0.096、全画面の 74.08% を占める。遠くへ行くほど明るくなり、最上縁では L 0.93 に達しても、無彩には決して行き着かない。空気の大きな面が欲しいなら、灰にも白にも寄せないこと:色相を一つ釘付けにして明度だけを上げ、いちばん手前にそれに作り変えられていない原色を一つ置く。勾配のひと手間は省いてよい。

この配色を持ち帰る

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

/* アシャヴァンレルム・霧の深み · Ashavan Realm, Deep in the Mist — Teyvat Palette */
:root {
  --far-ridge-haze: oklch(0.78 0.103 238); /* 遠稜の霞 #75c1f2 */
  --valley-mist: oklch(0.67 0.096 231); /* 谷霧の青 #50a0c6 */
  --canopy-teal: oklch(0.61 0.092 222); /* 梢陰の青碧 #378fab */
  --hill-cyan: oklch(0.68 0.095 226); /* 丘の青碧 #4fa4c5 */
  --near-green: oklch(0.64 0.103 157); /* 足元の緑 #519f73 */
  --corner-verdure: oklch(0.83 0.169 116); /* 隅の翠 #c2d43d */
  --gradient-ashavan-realm: linear-gradient(180deg, oklch(0.78 0.103 238) 0%, oklch(0.67 0.096 231) 26%, oklch(0.61 0.092 222) 55%, oklch(0.64 0.103 157) 82%, oklch(0.83 0.169 116) 100%);
}

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