Problem with this writing: var:preset|$feature|$slug

[devpeace]

Hello,
In this page (​https://developer.wordpress.org/themes/global-settings-and-styles/styles/using-presets/) we can see :
Technically, you can reference presets using the CSS syntax of var( --wp--preset--{$feature}--{$slug} ). But the WordPress var:preset|$feature|$slug syntax works much better and always appears correctly throughout the interface in the WordPress admin. Save the CSS syntax for when you are actually writing CSS.

However, writing "var:preset|$feature|$slug" works less well than writing "var( --wp--preset--{$feature}--{$slug} )".

In fact, in theme.json, if you use “var:preset|color|contrast !important” in “styles.blocks.elements.link.color.text” it won't work.
However, “var(--wp--preset--color--contrast) !important” does work.

Best Regards

[poena]

Hi
I believe this is working as intended, I don't think that these two formats are meant to be mixed?
@greenshady

[greenshady]

What @poena said is correct. You can't mix the "pipe-style" syntax with custom CSS. You have to use one or the other.

[poena]

@devpeace I am closing this ticket now since this is not a bug, I hope you were able to resolve it.