Silken Grape Soda のグラデーション

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

パステル寒色青紫

カラーストップ

HEXRGBOKLCH位置
#E8C8F0 rgb(232, 200, 240) oklch(87.2% 0.064 319.5) 0%
#AAE5FF rgb(170, 229, 255) oklch(89% 0.07 227) 50%
#FFDEC9 rgb(255, 222, 201) oklch(92.3% 0.046 54.5) 100%

CSS

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

background: linear-gradient(45deg, #E8C8F0, #AAE5FF, #FFDEC9);
background: linear-gradient(45deg in oklch, #E8C8F0, #AAE5FF, #FFDEC9);

Tailwind CSS v4

bg-linear-45/oklch from-[#E8C8F0] via-[#AAE5FF] to-[#FFDEC9]

自分好みに仕上げる

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