A bit of background on gradients. okclh.com evilmartians.com and gradient.style OKCLH is for Display P3 color support (more vivid / vibrant, if you upgrade your existing colors into that space) which you can see the difference with sRGB in some of the examples below.

If you don’t see a difference in below examples between sRGB and P3, it might be your display doesn’t support it.

sRGB vs P3

Tailwind-native:

Hello world

Button builder.io

Enabled

my text

Get started

Fashionunited color

(right end is the primary used troughout fashionunited.com) sRGB

sRGB

Upgrade Fashionunited color to P3

sRGB (fallbacks for P3, we could instead also use the above as fallback of course)

sRGB

".bg-fu-gradient": {
  background:
    "linear-gradient(to right, oklch(80% 0.24 14), oklch(59% 0.24 14))",
},
".bg-gradient": {
  background:
    "linear-gradient(to right, oklch(70.73% 0.18796955270463947 14.001408985933033), oklch(53.24% 0.21275278197593844 13.998586666801577))",
},
".bg-p3-gradient": {
  background:
    "linear-gradient(to right, oklch(70.73% 0.24 14), oklch(53.24% 0.24 14))",
},

sRGB

Gradients & P3

sRGB vs P3

my text

Fashionunited color

Upgrade Fashionunited color to P3