How to mimic Chakra UI's colorScheme prop?

[asterikx]

Is there a recommended way to re-create Chakra UI's colorScheme prop with Panda CSS?

If there is only a limited number of colors, as in the case of the Alert component, I can introduce a data-status attribute and style my components based on it (using green for data-status=success etc.). Is this the recommended solution?

How about arbitrary color schemes?

[anubra266]

@asterikx https://panda-css.com/docs/guides/virtual-color

[asterikx]

@anubra266 Thank you! I must have missed that when I was stepping through the docs.

[asterikx]

@anubra266 can a virtual color also be applied to recipes?

In case of the Alert component, the color from the colorScheme needs to be applied to multiple parts.