Teyvat Paletteテイワットパレット
シーンライブラリ
GitHub
ギャラリー
ベリル地区・満ちる光
フォンテーヌ昼開豁生い茂る盛夏

ベリル地区・満ちる光

Beryl Region in Full Light

色カード

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

再構成グラデーション

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

0%2d7ff214%a2d9fc28%90c9f042%7aaaba62%248b6c86%61af49100%aaa55b

なぜ調和するのか

「濃い」と「響く」は別々の二つの数字で、一つのつまみでは出せない。ベリル地区の彩度の中央値は 0.121、リフィー地区とまったく同じ濃さだが、その p99 は 0.195、リフィー地区は 0.160 しかない——同じ中央値で、一方には 0.074 の枠が残り、もう一方には 0.039 しか残らない。差は地上のあの半分の草ではなく、画面最上縁のあの空にある:中央の幅 40%・高さ 5% の天頂の矩形を、ここでは彩度 0.190、ブロー地区は同じ矩形で 0.163。中央値が高いこと自体は誤りではない。誤りは、中央値を上げたのに天井を一緒に上げなかったことだ。

01

画面の半分が高い位置に立っている

緑帯は 51.94% を占め、平均 L 0.68 / 彩度 0.138 / 色相 138°。下縁中央の幅 30%・高さ 12% の草の斜面を取ると、33408 画素の平均は L 0.68 / 彩度 0.158——ごく普通の前景の草地の平均が、すでにブロー地区の全画面 p99 である 0.164 に届いている。中央値 0.121 の出どころはこれがすべてだ。どこかが特別に濃いのではなく、画面の半分が高い位置に立っている。薄めるはずのものすら薄めていない——右中央から左下隅へ曲がりこむあの土の道、その左下の一段は実測 色相 105° / 彩度 0.096 で、草より黄色く草より淡いのに、90°–165° の緑帯から一歩も出ていない。全画面の 45°–90° の黄はわずか 0.14%(集落の入口のひまわり数輪)、330°–15° の赤は 0.01% しかない。画面を濃くしたいなら、どれかの彩度をひねるのではなく、まず一番広い面がどの段に立っているかを見ること。

02

天井はやはり空が出している

最も彩度の高い 4000 画素のうち 3705 画素が 240°–270° に落ち、平均 L 0.59 / 彩度 0.196、ピーク点の座標は (0.45, 0.02)——画面最上縁で、ブロー地区とまったく同じ構造だ。緑がどれだけ多くても押しのけてはいない:緑帯の最高彩度は 0.218、青帯は 0.225。変わったのはその空自体の深さだけで、それを決めたのはフレーミングである——上縁一帯(高さ 3%)の実測彩度は 0.117 で、ブロー地区の同じ一帯 0.152 より低い。右上隅に大きな積雲がのしかかっているからだ。雲を外して中央の空だけを取れば、0.190 対 0.163 になる。天井は調色でつくるものではなく、最も深い段の空を画面にどれだけ残したかである。

03

枠は二つの数字を一緒に計算する

フォンテーヌ六場面の彩度 p99 から p50 を引いて並べる:ブロー地区 0.071、モルテ地区 0.072、リフィー地区 0.039、ベリル地区 0.074、フォンテーヌ廷地区 0.049、研究院地区 0.069(ブロー地区とリフィー地区自身の本文は実測面から中央値を引いており、0.070 と 0.015。尺は違うが順位は同じ)。ベリル地区は六枚で最も枠が大きく、しかもその中央値は枠が最も小さい一枚と同じ高さだ——つまり「中央値を下げる」は枠を貯める一つのやり方であって、唯一のやり方ではない。節約しない道もある:画面を濃いままにして、最も深い段の空を画面に残すのだ。二本とも通じるが、二つの数字は必ず一緒に見ること。中央値だけを睨めば、ベリル地区をリフィー地区と読み違える。

この配色を持ち帰る

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

/* ベリル地区・満ちる光 · Beryl Region in Full Light — Teyvat Palette */
:root {
  --zenith-blue: oklch(0.61 0.19 258); /* 天頂の青 #2d7ff2 */
  --cumulus-pale: oklch(0.86 0.075 237); /* 積雲の淡青 #a2d9fc */
  --saw-peak: oklch(0.81 0.081 239); /* 鋸歯峰の青 #90c9f0 */
  --grey-scarp: oklch(0.71 0.056 221); /* 灰岩の崖 #7aaaba */
  --fir-ink: oklch(0.57 0.104 168); /* 樅の墨 #248b6c */
  --slope-green: oklch(0.68 0.158 139); /* 斜面の草の緑 #61af49 */
  --path-ochre: oklch(0.71 0.096 105); /* 土径の黄 #aaa55b */
  --gradient-beryl-region: linear-gradient(180deg, oklch(0.61 0.19 258) 0%, oklch(0.86 0.075 237) 14%, oklch(0.81 0.081 239) 28%, oklch(0.71 0.056 221) 42%, oklch(0.57 0.104 168) 62%, oklch(0.68 0.158 139) 86%, oklch(0.71 0.096 105) 100%);
}

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