Skip to content

Plus character in utility name doesn't work when defined in TypeScript configuration file #18930

@agusterodin

Description

@agusterodin

What version of Tailwind CSS are you using?

4.1.13

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

Next.js 15.5.3

What version of Node.js are you using?

22.18.0

What browser are you using?

Chrome

What operating system are you using?

macOS 15.6.1 (24G90)

Reproduction URL

https://github.com/agusterodin/tailwind-4-plus-character-bug-reproduction

Run using pnpm i and pnpm dev.

Describe your issue

Any utility class defined in my tailwind.config.ts file that contains a plus (+) character is ignored and not usable. Plus characters in utility names used to work in v3 but no longer work in v4. Plus characters appear to work if I use the new CSS method of defining utilites, however I cannot use pure CSS for my configuration because my theme contains complex stuff that requires TypeScript (not shown in my minimal reproduction).

Example: notice sm+ isn't showing up in Intellisense.

Image Image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions