Teyvat Paletteテイワットパレット
シーンライブラリ
GitHub
ギャラリー
風止みの山・浮雲
モンド昼澄明遥か軽やか

風止みの山・浮雲

Windrest Peak under Drifting Cloud

色カード

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

再構成グラデーション

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

0%4582fa30%f0f6fc48%27779e72%7bc0bc100%6bcb67

なぜ調和するのか

座席が空いているときの一つめの生き方は、焦点を色相環の外にあるものへ渡すことだ:草の斜面 143° と空 244° は 101° 離れ、等距離点は 13.5° に出るのに、330°–60° は画面全体で 315 ピクセル(0.036%)しかなく、彩度も 0.080 で打ち止め——あの一度には誰も座っていない。そのかわり、最も明るい 4000 ピクセルのうち 3937 個が右縁の同じ一マスの雲に集まり、L 1.00、C 0.000。無彩は色相環の上にないので、どの族に対しても色相の借りがない。二つの大きな色のあいだが空いていても構わない——本物の白は、どの角度からでも割り込める。

01

三つの候補位置がそろって空いている

330°–60° は 315 ピクセルきり。さらに割ると 345°–15° が 42 個、290°–335° が 55 個、35°–75° が 114 個——等距離点も二つの補色点も、すべて空だ。下縁の斜面に散って黄色い花に見えるタンポポも、測れば 2,091 ピクセル、色相 101°、まだ緑の帯の中にいる。画面全体で 45°–90° は 0.06% にすぎない。この絵は上から下まで、空 67.89%、霧水 9.23%、草 17.56% の三本の帯だけでできていて、暖色のピクセルを一つも出すつもりがない。

02

白は場所を選ばなくてよい

最も明るい 4000 ピクセルのうち 3937 個が同じマス (0.8, 0.2) に落ちる。L 1.00 / C 0.000——右縁のあの大きな積雲は「ごく淡い青」ではなく、純白である。そこから一歩の左上の天頂は L 0.63 / C 0.190 / 262° で、最も彩度の高い 4000 ピクセルのうち 3850 個もそこにある。同じ一枚の空が、一方の端で彩度を 0.190 まで使い切り、もう一方の端でゼロに手放す。そのおかげで、あいだの 101° の空席は埋めなくてよくなる。ふさわしいアクセントの色相がないときは、徹底した無彩を一面置くこと——立場がないから、誰とも衝突しない。

03

調停役はアクセントの代役にならない

165°–210° は 9.23%、色相 192° は草の斜面 143° と空 244° のちょうどあいだに落ち(両側にそれぞれ 49° と 52°)、明度 0.76、彩度 0.070 とどちらも低く抑えられている——中段で地平線をまるごと消してしまう水と水気であり、〈風唸りの丘・晴れと松の陰〉のあの松林帯と同じ職種だ。ただしそれは短い弧の内側にあり、座席は短い弧の外側にある:調停役は両族の近くに、アクセントは両族から遠くにいなければならない。片方だけがある絵は成立する。調停役でアクセントの穴埋めをしないこと。

この配色を持ち帰る

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

/* 風止みの山・浮雲 · Windrest Peak under Drifting Cloud — Teyvat Palette */
:root {
  --zenith-blue: oklch(0.63 0.19 262); /* 天頂の青 #4582fa */
  --cumulus-white: oklch(0.97 0.01 250); /* 積雲の白 #f0f6fc */
  --mist-water: oklch(0.76 0.07 192); /* 霧水の青 #7bc0bc */
  --island-rock: oklch(0.54 0.097 234); /* 島岩の青 #27779e */
  --slope-green: oklch(0.76 0.164 143); /* 斜面の草の緑 #6bcb67 */
  --dandelion: oklch(0.9 0.134 101); /* タンポポの黄 #f1e171 */
  --gradient-windrest-peak: linear-gradient(180deg, oklch(0.63 0.19 262) 0%, oklch(0.97 0.01 250) 30%, oklch(0.54 0.097 234) 48%, oklch(0.76 0.07 192) 72%, oklch(0.76 0.164 143) 100%);
}

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