Teyvat Paletteテイワットパレット
シーンライブラリ
GitHub
ギャラリー
花翼の集 部族秘蔵所・晴れた真昼
ナタ昼晴れ晴れ賑わい草の匂い

花翼の集 部族秘蔵所・晴れた真昼

Flower-Feather Clan Secret Space, Clear Noon

色カード

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

再構成グラデーション

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

0%5a85a814%62253944%69382c64%6b6a91100%8ca851

なぜ調和するのか

多くの場面に置かれる要素は、コントラストを自分の中に焼き付けてはいけない。花翼の集のこの一枚はこの組で最も明るく最も濃い——明度中央値 0.43、彩度中央値 0.078、無彩はもう 6.33% しかなく、八つの色相帯すべてに量がある——そしてあの門の彩度 0.060 は画面の中央値を下回り、倍率は 0.77、同じ門が五枚の中で 1 を割った唯一の一度だ。懸木の民の夜景では 2.3 倍だった。同じ一色、五つの環境、主役から書き割りまで一続きに落ちていく。再利用する要素の定数は、最も明るい場面で「まだ見つかる」ように決めるべきで、最も暗い場面で「最も目立つ」ように決めてはならない。

01

真昼が三本の通路をすべて埋めた

真昼に透かされた手前の草は実測 L 0.69 / 彩度 0.118 / 色相 124°、その中の白い花の一群は L 0.70 / 0.111。赤砂岩の崖面は L 0.40 / 0.073 / 35°、建物の隙間からのぞく空は L 0.60 / 0.072 / 244°、崖の上の低木は L 0.38 / 0.076 / 84°、部族から垂れる長い旗は、画面上部の幅 20%・高さ 15% のうち 340°–30° に落ちる 5542 画素で L 0.36 / 0.090 / 2°。明度は 0.36 から 0.70 まで並び、彩度は 0.072 から 0.118 まで並び、色相は八帯すべて埋まっている——門の L 0.54 / 彩度 0.060 / 色相 285° は、どの順位表でも上位に入らない。

02

その色相さえ、もう珍しくない

懸木の民の夜景では、門の一族(240°–300°)は 2.36% しか無く、しかも他に供給源が無かった——その色相は画面ぜんぶが門のものだった。ここでは 210°–300° に 86942 画素、9.88% がある:空も、遠くの建物の影も、宙に浮かぶ気球も同じ一族だ。門のわきの岩は実測 L 0.37 / 彩度 0.073 / 色相 40° で、門はそれより 0.17 明るいだけ。全画面の明度 p99 はすでに 0.79 に達しており、この 0.17 は真昼のダイナミックレンジではごく浅い窪みでしかなく、見た目には崖裾の開口部にすぎない。珍しさは環境が与えるもので、要素が自分で持ってくるものではない。

03

定数は最も明るい場面に合わせて決める

この門の絶対値は五枚を通してほとんど動いていない:明度 0.46 から 0.59、色相 253° から 295°、彩度 0.026 から 0.070。動いたのは環境のほうだ——無彩の比率は 55.13% から 0.97% へ、彩度中央値は 0.023 から 0.078 へ。その結果、中央値に対する彩度の倍率は 2.3 から 0.77 まで落ちた。再利用される要素はこうあるべきなのだ:夜景に合わせて「最も目立つ」ようにすれば、真昼には白い斑に焼き付く。真昼に合わせて「まだ見つかる」ようにすれば、夜には自然と唯一の光になる。デザインシステムのハイライト状態、ロゴマーク、インジケーターも同じ道を行く——絶対の定数を一つ決め、各場面には自分の余っている通路でそれと差をつけさせること。コントラストを要素の中に書き込まないこと。

この配色を持ち帰る

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

/* 花翼の集 部族秘蔵所・晴れた真昼 · Flower-Feather Clan Secret Space, Clear Noon — Teyvat Palette */
:root {
  --cliff-ochre: oklch(0.4 0.073 35); /* 崖の赭 #69382c */
  --noon-grass: oklch(0.69 0.118 124); /* 真昼の草緑 #8ca851 */
  --zenith-blue: oklch(0.6 0.072 244); /* 隙間の空 #5a85a8 */
  --canopy-yellow: oklch(0.38 0.076 84); /* 梢の黄 #553e03 */
  --banner-red: oklch(0.36 0.09 2); /* 旗の紅 #622539 */
  --gate-violet: oklch(0.54 0.06 285); /* 門の紫 #6b6a91 */
  --gradient-tribal-secret-space-flower-feather-clan-location-context: linear-gradient(180deg, oklch(0.6 0.072 244) 0%, oklch(0.36 0.09 2) 14%, oklch(0.4 0.073 35) 44%, oklch(0.54 0.06 285) 64%, oklch(0.69 0.118 124) 100%);
}

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