Obsidian Candyfloss のグラデーション

#120022 から #855450 までの、2 色のリニア CSS グラデーションです。OKLCH で補間しているので、中間の色も鮮やかなままです。

ダーク暖色ツートン赤紫

カラーストップ

HEXRGBOKLCH位置
#120022 rgb(18, 0, 34) oklch(14.5% 0.075 305.7) 0%
#855450 rgb(133, 84, 80) oklch(50% 0.066 24.8) 100%

CSS

1つ目の宣言は、すべてのブラウザで使える通常の sRGB グラデーションです。2つ目は OKLCH で補間し、中間の色も両端と同じ鮮やかさに保ちます。

background: linear-gradient(0deg, #120022, #855450);
background: linear-gradient(0deg in oklch, #120022, #855450);

Tailwind CSS v4

bg-linear-0/oklch from-[#120022] to-[#855450]

自分好みに仕上げる

Gradient Maker でストップ、角度、種類を変更するか、ストップをパレットに変換できます。