Teyvat Paletteテイワットパレット
シーンライブラリ
GitHub
ギャラリー
稲妻城・霧の桜
稲妻昼朦朧桜色静雅

稲妻城・霧の桜

Inazuma City, Sakura in the Mist

色カード

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

再構成グラデーション

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

0%85bbda30%bd97c755%70acb278%958ab7100%5184b7

なぜ調和するのか

アクセントの二つの使い方が、この一枚で勝負を分ける。桜の粉は約 3%——璃月港の暖色(2.6%)とほぼ同じ面積なのに、島じゅうに数十の小さな点として撒かれている。集めれば主役、撒けばテクスチャ。面積が同じでも、役割は別物になる。

01

撒いたアクセントは空気になる

桜の粉(319°、C 0.080)と雷の紫で合計およそ 3%。それが数十の小さな塊に分かれて島全体を覆っている。璃月港のほぼ同面積の暖色は、逆に一本の狭い帯へ集まっていた。集まれば焦点として読まれ、撒かれればテクスチャとして読まれる——雰囲気が欲しければ細かく均して撒き、主役が欲しければ一か所へ寄せること。

02

城はシルエットである

天守は実測 250°、L 0.60、霧の海は L 0.77。83% が青い霧のなかで、建築は色の差で見えているのではなく、0.17 の明度差で見えている。霧景の都市はつまり一枚のシルエットだ。細部は輪郭に任せ、色は環境へ完全に譲ってよい。

03

紫は稲妻の戸籍である

画面で唯一まとまった規模を持つ非青の色相は、296°–319° の紫と粉の一族——雷の紫と桜の粉が同じ色族を共有している。地域の視覚的記憶は、たった一族のアクセントで維持できる。地の色は天気や時刻でどう変わってもよい。戸籍の色を替えなければよい。

この配色を持ち帰る

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

/* 稲妻城・霧の桜 · Inazuma City, Sakura in the Mist — Teyvat Palette */
:root {
  --sea-mist: oklch(0.765 0.072 235.4); /* 海霧の青 #85bbda */
  --shallow-teal: oklch(0.706 0.063 203); /* 浅瀬の青 #70acb2 */
  --castle-indigo: oklch(0.599 0.096 250.4); /* 天守の藍 #5284b7 */
  --sakura-pink: oklch(0.727 0.08 318.8); /* 桜粉 #bd97c7 */
  --electro-violet: oklch(0.66 0.067 296); /* 雷紫 #958ab7 */
  --gradient-inazuma-city: linear-gradient(180deg, oklch(0.765 0.072 235) 0%, oklch(0.727 0.08 319) 30%, oklch(0.706 0.063 203) 55%, oklch(0.66 0.067 296) 78%, oklch(0.599 0.096 250) 100%);
}

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