Chakra UI v3 and my experience using it with TanStack Start is coming soon.

Why do I want you to meet Chakra?

I met ChakraUI v2 back in 2024 when it was a specific requirement for a technical test I was participating in.

On the very first moment I tasted the work with the ChakraUI's API for styling components, I was immediately interested on diving as deep as it could get.

The autocompletion, type-safety, and most of all: the intuitive way props and values came to my mind and worked right out, made me feel backed by a robust system.

<Stack colorPalette="orange">
<Icon as={<Star/>} color="colorPalette.emphasized"/>
<Text color="colorPalette.fg">Hivepen is building apps and games integrated with Hive</Text>
</Stack>

Pros..
But there were also Cons. The hard compatibility with Tailwind, the closed component architecture, and it's exclusivity to React, kept me from using it widely on my own projects back when I was more experienced with Vue + Nuxt.

Do you think something changed in v3?
Well, almost Everything changed in October 2024!

On their own words:

« Chakra v3 is a complete rewrite of Chakra to enhance its performance, speed and consistency across components. We've also added over 25 new components, and that's just the beginning. »

About that, and all the technologies that powered it, (Ark, PandaCSS, Park) I will be talking about in a following series.

Please, your're welcomed to share in the comment any opinions and interesting facts you know about it, I'll be reading and I'd love to hear that you gave Chakra a try after this.