Tailwind 4.1 oklch colors don't work on old safary if decimal is provided instead of percentage.

[entrenadorhispano]

Subtle bug using safari 15.8
Tailwind 4.1 oklch colors don't work on old safary if decimal is provided instead of percentage.

oklch(70% 0.15 162) This will work ✅
oklch(0.70 0.15 162) This won't ❌

System
Using Vite (svelte) + Tailwind 4.1.7 + node 22.14

Reproduction sample:
https://play.tailwindcss.com/fPW5BsNPNT

Note
Using decimal for lightness oklch(0.70 0.15 162) works on safari 15.8 plain css... So its seems to be a tailwind bug.

Thanks fort the support!

[wongjn]

Does it work when you run a production build? When in development, Tailwind has higher browser support requirements in the interest of speed but the CSS is transpiled down to be more compatible in production builds. According to this Lightning CSS playground it should transpile the decimals into percentages.

[philipp-spiess]

Hey! Yep, you're right. Safari 15.8 does not support the decimal format of specifying oklch(…) colors. We actually changed all colors to use the percentage format in the 4.1 release to improve compatibility with older versions of Safari, see: #17435

Can't do more here than change our default colors I'm afraid. If you use custom colors, you'll need to change this to use the percetnage color yourself. Note that we don't have full support for Safari versions prior 16.4: https://tailwindcss.com/docs/compatibility#browser-support