
Chemin de L'Espoir in Abyssal Light
色をクリックすると HEX をコピー、ホバーで OKLCH 値を表示します。
シーンから蒸留したグラデーションをストップ順に左から右へ展開。完成角度は 225°(ヒーローとエクスポートで使用)、ギャラリーのカードは一律 135° の斜めで表示します。
面積・彩度の天井・明度の天井——ひとつの色相族が取れるのは多くて二つまでである。この深い水では青が 84.73% を占め、彩度の頂点 0.250 も握っている(最も鮮やかな 4000 画素は 4000/4000 が 240°〜270°)。だから三つ目は丸ごと手放される——最も明るい 3584 画素はすべて 196°〜206° に落ち、15.14% しかない青緑のものだ。配り終えたあと、画面の残り全部には使える通路がない:半分の画素が L 0.33 から 0.39 の六ポイントに押し込められ、互いを分けられるのは色相だけになる。
CSS 変数、Tailwind v4 テーマ、または SVG。ワンクリックでプロジェクトへコピーできます。
/* 希望の道・淵の光 · Chemin de L'Espoir in Abyssal Light — Teyvat Palette */
:root {
--abyss-blue: oklch(0.39 0.082 235); /* 淵の青 #024b6a */
--algal-flare: oklch(0.45 0.159 257); /* 藻の焔 #0151ab */
--coral-glow: oklch(0.83 0.142 202); /* 珊瑚の白光 #00e2ef */
--gate-light: oklch(0.82 0.126 206); /* 門の光 #41dbec */
--masonry-teal: oklch(0.43 0.073 206); /* 石積みの青 #025b63 */
--gradient-chemin-de-lespoir: linear-gradient(225deg, oklch(0.39 0.082 235) 0%, oklch(0.43 0.073 206) 30%, oklch(0.82 0.126 206) 58%, oklch(0.83 0.142 202) 78%, oklch(0.45 0.159 257) 100%);
}1080×1350 の PNG。元の風景・パレット・カラーコードが入っているので、保存してそのまま投稿できます。