[v4] How to use --value with @utility and wildcard *

[sjahan]

I try to upgrade from v3 to v4 and we did generate a lot of utilities using plugins and matchUtilities with v3.

Let's imagine that I had an utility class which would work like that: .custom-background-red would @apply bg-red-500;. Of course, i want to do that for all of the colors defined in my theme.

The question is: how to write that with @utility and *
I have tried many attempts like the following:

@utility custom-background-* {
    background-color: --value(--color-*-500);
}

but nothing gave me what I want to achieve and there is not much documentation about --value currently.

NB: If this is not the proper approach for this, please let me know, it is completely possible that I go the wrong way.

Thank you!

EDIT:

I found out that:

@utility custom-background-* {
    background-color: --value(--color-\*);
}

is working but i have to pass the full name of the color. It seems that if there is something after the * in value then it does not work. I want to be able to pass a color scheme name and the @utility deals with the steps.