Skip to the color picker
PickShade

CSS gradient generator

Build smooth gradients in OKLab or OKLCH, without the gray dead zone of RGB. Copy CSS or Tailwind classes.

Colors

Blend in

OKLab keeps the middle bright. sRGB is how old browsers blend and often turns gray in the middle.

Type
90°

CSS

background: linear-gradient(90deg, #ff5733, #ec6659, #d87075, #c3788d, #ae7ea4, #9781b9, #7e83ce, #6183e2, #3b82f6);
background: linear-gradient(90deg in oklab, #ff5733, #3b82f6);

Tailwind CSS v4

bg-linear-90/oklab from-[#ff5733] to-[#3b82f6]

Colors along the gradient

7