Tailwind merge wrongly merge background-opacity with background-color.

[ngtrthinh169TPC]

Describe the bug

When background-color is used with background-opacity, the latter written will be removed by tailwind-merge. This disallows any efforts to make transparent effects.

To Reproduce

https://codesandbox.io/p/sandbox/unruffled-bose-cssr35?file=%2Fsrc%2Findex.ts%3A21%2C71

Expected behavior

background-color and background-opacity should not collide. Both of the classes should be kept.

Environment

• tailwind-merge version: 2.4.0

[dcastil]

Hey @ngtrthinh169TPC! 👋

This is indeed a bug. The problem is that tailwind-merge only accepts numbers within arbitrary values of opacities and then erroneously defaults to classify it as a background-color class. I'll fix it in the coming days.

In the meantime you can work around it by using bg-opacity-[0.48] instead. That should work without issues.

[github-actions]

This was addressed in release v2.5.0.