[v4] Background color overrides accent on checkboxes

[Blackskydk]

"@tailwindcss/vite": "^4.0.1",
"tailwindcss": "^4.0.1",

If a background-color is applied to a the accent color won't be shown when the checkbox is checked. It only shows the background-color applied. In v.3.4.3 this was possible

[RobinMalfait]

Hey!

It looks like this behaves the same in v3 and v4 for me. Can you try and reproduce the issue you are running into?

• v3: https://play.tailwindcss.com/HDAv7owh3L
• v4: https://play.tailwindcss.com/ijBPvwYSuh

[Blackskydk]

I can see that it is the same in both v3 & v4 in the playground. However in my app that used v3.4.3 it was possible to style both background and accent color. I though this was intended behavior

[Blackskydk]

I am dumbfounded. I removed the accent part from my checkbox, and added :checked:bg-primary and it works in my app. but it does not work in tailwind play.

<input
    type="checkbox"
    class="rounded bg-white dark:bg-gray-900 shadow-xs text-primary border-gray-300 dark:border-gray-700 focus:ring-primary checked:bg-primary"
/>