
Moontide Sea after Dark
色をクリックすると HEX をコピー、ホバーで OKLCH 値を表示します。
シーンから蒸留したグラデーションをストップ順に左から右へ展開。完成角度は 180°(ヒーローとエクスポートで使用)、ギャラリーのカードは一律 135° の斜めで表示します。
一本の線を画面の主語にしたいなら、明度と彩度を同じ線の上で一緒に跳ばせばよい。地平線の上は実測 L 0.13・彩度 0.026、下は L 0.70・彩度 0.137——明度差 0.57、彩度差 5.3 倍、同じ境界で二つのチャンネルが同時に断ち切れている。
CSS 変数、Tailwind v4 テーマ、または SVG。ワンクリックでプロジェクトへコピーできます。
/* 遊月の海・夜の潮 · Moontide Sea after Dark — Teyvat Palette */
:root {
--night-vault: oklch(0.13 0.026 263); /* 夜天の黒 #030712 */
--haze-violet: oklch(0.24 0.073 268); /* 霞の紫 #111c41 */
--moontide-blue: oklch(0.7 0.137 239); /* 潮の青 #38a9ea */
--deep-tide: oklch(0.59 0.212 258); /* 深潮 #0d76f7 */
--shoal-white: oklch(0.9 0.048 152); /* 汐の白 #c7e8cf */
--dawn-pink: oklch(0.77 0.098 317); /* 曦の粉 #cea1de */
--gradient-moontide-sea: linear-gradient(180deg, oklch(0.13 0.026 263) 0%, oklch(0.24 0.073 268) 34%, oklch(0.7 0.137 239) 44%, oklch(0.59 0.212 258) 100%);
}1080×1350 の PNG。元の風景・パレット・カラーコードが入っているので、保存してそのまま投稿できます。