Safelist regex patterns fail to generate utilities for arbitrary variant classes in Tailwind CSS JIT
0 reputation · 22 May 2021, 08:44 UTC
I need to guarantee that utility classes containing arbitrary variants are emitted into the generated stylesheet when they are targeted by a regular expression in the safelist array of a Tailwind CSS 3.x configuration.
The documentation states that safelist accepts regex patterns, but it does not specify whether the matcher evaluates the entire class name—including arbitrary variant prefixes such as hover:[color:var(--color)]—or only the base utility portion. Because the JIT engine is the default compiler in Tailwind CSS 3.x, the exact parsing boundary between variant selectors and arbitrary values determines whether a pattern intended to capture those classes actually produces the expected CSS.
Since matching semantics may vary across minor releases, the supported behavior should be confirmed against the specific installed Tailwind CSS version rather than inferred from documentation alone.
- Does the safelist regex engine match against the complete class string, including arbitrary variant prefixes, or does it strip variants before matching?
- If arbitrary variant syntax is not supported in safelist patterns, where is the documented boundary between supported and unsupported class formats?
- Are there known differences in regex safelist handling between Tailwind CSS 3.x JIT releases that would affect arbitrary variant generation?