Skip to content

[v4] Utility modifiers only work with arguments #16824

@royduin

Description

@royduin

With Tailwind 4 (4.0.9 currently); modifiers only seem to work with utilities that do have an argument, this works:

@utility text-* {
  --alpha: calc(--modifier(integer) * 1%);
  color: --alpha(--value(--*, [color]) / var(--alpha, 100%));
}

With text-default, text-default/50, text-blue, text-blue/50, etc.

This doesn't work:

@utility text {
  --alpha: calc(--modifier(integer) * 1%);
  color: --alpha(red / var(--alpha, 100%));
}

With just text, text/50, etc. as the modifier isn't parsed.

Demo: https://play.tailwindcss.com/ECphsE1vzA?file=css


Related discussion: #15775

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions