If you use Atomic recipes in @panda__css using `cva`, you can also convert them to Config recipes. Unlike atomic recipes, config recipes are extracted and generated just in time. This means that regardless of the number of recipes in your design system, only the recipes and variants you use will exist in the generated CSS🔥 They also generate readable classnames 👌🏻

@panda__css got some neat utilities ✨

Conditions in @panda__css allow you to change styles depending on specific states or situations. For example, if I want to style an SVG element specifically, I can create a condition in the Panda config file. To use this condition, I prefix it with an underscore. This tells Panda to only apply that style when that specific condition is true.

Check out how @panda__css supports the native css nesting and also provides different ways of nesting styles using pseudo props like `_hover` and `_focus` 🔥

🐼 Panda CSS - Origins Over the weekend, I had time to reflect on and document how @panda__css was created: the thought process, initial prototype, and decision points. Read the post here 👇🏻 adebayosegun.com/blog/panda-…

Vote for "Panda CSS" in the upcoming GitNation awards 🐼💛 osawards.com/javascript/

Using the impeccable @panda__css too.

I created a @remix_run template using @grizzly_codes 's Park UI, @panda__css and @framer for page transitions github.com/itsjavi/remix-par…

The quickest way to add opacity to colors when using @panda__css is to use the color opacity modifier. Here's a quick demo of how it works 👇