
Djafar Tavern in Sifted Light
色をクリックすると HEX をコピー、ホバーで OKLCH 値を表示します。
シーンから蒸留したグラデーションをストップ順に左から右へ展開。完成角度は 180°(ヒーローとエクスポートで使用)、ギャラリーのカードは一律 135° の斜めで表示します。
影の色相は、頭上にある物の署名である:同じテラスの石畳を測ると、巨樹の樹冠の下では L 0.34 / 彩度 0.029 / 色相 150°、枝の隙間を抜けた光が落ちた場所では L 0.70 / 彩度 0.057 / 101°——陽の当たる一点が報告しているのは太陽であり、49° 離れたもう一方が報告しているのは葉である。証拠は同じ絵の下縁にある:軒の外のあの石段は、明度がテラスより 0.06 高いだけなのに色相は 217°、画面上四分の一に写る空の 239° とはわずか 22° しか違わない。同じ回のスメール市街の店先四枚は、陽の当たる敷石の色相がすべて 100°–115° に収まる——誰が照らされても同じだ。ある空間を一目でその場所だと分からせたいなら、変えられるのは頭上に何が架かっているかだけである。
CSS 変数、Tailwind v4 テーマ、または SVG。ワンクリックでプロジェクトへコピーできます。
/* ジャファータバーン・木洩れ日 · Djafar Tavern in Sifted Light — Teyvat Palette */
:root {
--canopy-ink-green: oklch(0.36 0.063 172); /* 樹冠の墨緑 #0e4839 */
--glazed-shell-green: oklch(0.46 0.076 164); /* 釉薬瓦の殻緑 #28654d */
--shaded-terrace: oklch(0.34 0.029 150); /* 陰のテラス #2d3c30 */
--skylit-steps: oklch(0.43 0.048 217); /* 天光の石段 #2f5661 */
--sifted-sunbeam: oklch(0.7 0.057 101); /* 篩われた光 #a6a077 */
--sunlit-leaf: oklch(0.67 0.157 137); /* 陽の当たる葉 #63ab42 */
--lantern-amber: oklch(0.69 0.156 57); /* 灯籠の琥珀 #e27e21 */
--gradient-djafar-tavern: linear-gradient(180deg, oklch(0.36 0.063 172) 0%, oklch(0.67 0.157 137) 12%, oklch(0.46 0.076 164) 30%, oklch(0.69 0.156 57) 48%, oklch(0.34 0.029 150) 64%, oklch(0.7 0.057 101) 80%, oklch(0.43 0.048 217) 100%);
}1080×1350 の PNG。元の風景・パレット・カラーコードが入っているので、保存してそのまま投稿できます。