#20483·Tailwind CSS

@custom-variant firefox (:-moz-any(&)); breaks in 4.3.3

Author: alexandre184Created Sep 11, 2026Updated Sep 11, 2026

What version of Tailwind CSS are you using?

v4.3.3

What build tool (or framework if it abstracts the build tool) are you using?

tailwindcss-rails v4.6.0

What version of Node.js are you using?

For example: v22.19.0

What browser are you using?

Firefox

What operating system are you using?

macOS

Reproduction URL

works in v3.4.19 : https://play.tailwindcss.com/9zUopjQm94?file=config

works in v4.3.2 : is there a way to get that version in the playground?

no longer works in v4.3.3 : https://play.tailwindcss.com/VNQvmXLHkC?file=css

Describe your issue

Maybe related to that change https://github.com/tailwindlabs/tailwindcss/pull/20124. The css generated for firefox:bg-red-500 with the custom variant @custom-variant firefox (:-moz-any(&)); is in v4.3.3:

.firefox\:bg-red-500 :-moz-any(&) {
  background-color: var(--color-red-500);
}

It was in v4.3.2:

.firefox\:bg-red-500 {
  :-moz-any(&) {
    background-color: var(--color-red-500);
  }
}

Source: tailwindlabs/tailwindcss