DEV Community

Esther Adebayo
Esther Adebayo

Posted on

7 Years of Chakra UI: The Journey from 0 to 6.1 Million Monthly Downloads

Phewww! Where did all the time go?

This September makes it 7 years building Chakra UI! We've gone from 0 to 6.1 Million Monthly Downloads in a year. Not only that:

  • 40,700 Github stars
  • 250,000 website visits/month
  • 114 components
  • 413 contributors
  • 4 major versions

Those numbers look shiny...

But they don't really tell you what building an open source project and community for seven years looks like.

So, I want to take you behind some of those numbers and into what building Chakra and its community over the years has actually looked like.

Before Chakra was Chakra

Chakra started because Segun Adebayo was trying to solve a problem he had himself.

The frontend ecosystem was obviously very different in 2019 as there were already component libraries and several styling solutions.

However, there were things Segun wanted from the experience of building interfaces that he wasn't quite getting.

He wanted the design to development flow to be consistent and seamless.

So he started experimenting.

I remember him walking me through the first drafts of Chakra components even before the name came. I loved it and was extremely excited.

Little did I know it'll be quite a ride.

Launching Chakra UI

The launch story has been written a few times. If you're not familiar with it, I'll happily recount it again.

On the 4th of September, 2019, Segun pulled the trigger and announced the launch of Chakra UI publicly. The buzz was everything we didn't see coming in this tweet.

More than 40 accessible React components were part of that early release.

There was very little 'strategy' to the actual launch. More work was done on the product than actual developer education and developer marketing.

But we kept talking about Chakra and that's when it hit me.

DevRel before Developer Relations

From the reactions we got from Twitter, GitHub and our Discord communities, it didn't take me long to realise that we had to invest time to educate developers and build the community.

At that time, "Developer Relations" wasn't even part of my vocabulary.

I just saw a gap to feel - I really wanted to contribute and educate developers in order to drive the adoption of Chakra UI.

Tidbits

My first instinct was to start sharing code snippets on Twitter.

These were small tips showing people things they could do with Chakra. I didn't want anything too overly produced.

I just wanted to share useful information on how a Developer could get from point A to B using Chakra.

And I think there's something worth learning from that today.

We sometimes overcomplicate DevRel.

We create strategies and funnels and content pillars and... dashboards.

A lot of early Chakra education was basically:

We made something useful, now this is how to use it.

And it worked really well.

Component of the Week

One of the things I started doing earlier on, was Component of the Week.

The idea actually came from observation.

I had seen something similar in the Flutter community and loved how they took one widget at a time and made it easy for people to see what it could do. I thought, why don't we do something like this for Chakra?

So every week, I'd pick a component.

I'd figure out what I wanted to show, put the visuals together, animate everything in Canva, record a voiceover, edit the video and put it out on YouTube.

Every Single Week

Each video probably took me somewhere between 5 and 8 hours to make.

And honestly, I learned a lot doing this.

I was spending so much time with one component every week, so naturally I was learning the APIs better, finding interesting use cases and thinking more deeply about how we explained things to developers.

But it was also a huge learning point for me personally, especially with video.

I got better at scripting, animation, better at voiceovers.

Better at taking something technical and turning it into a short video someone would actually want to watch.

And I learned something else from doing it week after week.

When you look at one Component of the Week video in isolation, it probably doesn't seem like much.

But when you keep doing it every week, it has a ripple effect.

One video becomes 10. 10 becomes a library of videos.

People start expecting the next one.

And you get better at making them!

I think that's one of the biggest things Chakra has taught me about DevRel.

You don't always need a huge campaign. Sometimes you just need to find something useful, keep showing up and give it enough time to compound.

Chakra UI for Beginners

A lot of things happen step by step.

You do one thing, notice something else, and the next idea naturally unravels from there.

That's pretty much how my first Chakra UI course happened.

The docs were already doing a good job of explaining Chakra, but I kept thinking about how we could make the time to "Hello World" even shorter for someone discovering Chakra for the first time.

What if you didn't just give them documentation to read?

So I decided to create Chakra UI for Beginners.

The complete course for absolute beginners to understand how Chakra UI works and get started building. What you'll learn: - How to Set up Charka UI in your R...

favicon youtube.com

It was a structured 20-lesson course that started from installation, moved through the core concepts of Chakra UI, and ended with actually building an interface.

At the time, I was mostly trying to solve one problem: make it easier for someone to go from "I've heard about Chakra" to "I can actually build with this."

The course has now been watched nearly 100,000 times, and years later, I still get messages and comments from developers who are discovering Chakra through it.

Driving adoption has always been a big part of how I think about my work at Chakra, even though what that looks like changes.

Developer education drives developer adoption.

We hosted a hackathon

In 2022, we decided to try something we hadn't done before.

A Chakra UI hackathon.

Or, as we called it, Chakrathon '22 :)

Like a lot of things I've worked on at Chakra, it started with a question: would people actually be interested?

So before planning anything, we asked.

We put out a poll on Twitter asking the community if they'd be interested in a Chakra hackathon. 92% of the 79 people who responded said yes.

So, from May 3rd to May 20th, we ran our first ever Chakra UI hackathon, with people joining from different parts of the world.

We gave everyone one challenge:

Build the best Single Select component for Chakra UI.

We split the hackathon into two rounds. In the first, teams presented their API and design decisions. The teams that made it through then had to turn those ideas into working components.

Looking back, I really like that we structured it this way.

By May 20th, Team Dragonball took first place and $2,000, Team Genki came second with $1,000, and Team Saitama came third with $750.

My favorite part of this hackathon was seeing people work together to think deeply about what should go into the library.

That's one of the things I've come to appreciate about building an open source community.

Community starts to feel different when people participate.

Chakrathon was one of the ways we tried to create memorable community moments.

Thursdays were for Chakra

There's another part of Chakra's history you won't find on npm :)

Thursdays

For years, members of the Chakra team (contributors and maintainer) would get together every Thursday.

Chakra Team Meeting

We talked about components, APIs, things we needed to ship, what wasn't working, what Chakra should become and a whole lot more.

And, knowing developers, probably spent a very reasonable amount of time discussing things that were supposed to take five minutes :D

It's important to talk about these calls and what the team internal looked like because when we talk about open source, we mostly talk about only the project and features.

But there's an enormous amount of work that happens before any feature even exists.

Get off Zoom

In 2021, members of the Chakra team flew to Dubai.

Some came from the US.

Some from Germany.

Some from Macedonia.

People who had spent months working together on our open source project and finally got to hang out in person.

Chakra UI Team Hangout 2021

Then we did it again in 2022.

Chakra UI Team Hangout 2022

Developer Education got deeper

By 2025, the problem was a little different.

It wasn't just "How do I get started with Chakra UI?" anymore.

Chakra had evolved, and so had the kinds of things developers were trying to build with it.

Teams were building design systems. They wanted custom tokens, recipes, variants, semantic tokens, custom components and more complex theming setups.

And with Chakra UI v3 which you'll read about shortly, there was a lot to learn.

That's where Theming Mastery came from.

I wanted to create something that went much deeper into how Chakra's theming system actually works and, more importantly, how to use it to build a design system that doesn't become painful to maintain six months later.

So in 2025, I released the Chakra UI Theming Mastery course.

Education has to grow with the product.

Early on, the most useful thing you can do might be helping someone get from installation to their first interface.

Later, it's helping the person who already knows your library solve the much harder problems they run into when using it at scale.

Both matter for adoption.

One helps someone start using Chakra.

The other gives them a reason to keep using it.

Chakra Shipped

More recently, I started Chakra Shipped, a spotlight series to share some of the cool things people in the community are building with Chakra UI.

For four weeks, we shared a new project every Thursday and got the builders to tell us a little about what they built and why.

I really enjoyed putting this together because we spend a lot of time talking about what we're building at Chakra, but it's also nice to turn that around and show what people are building with it.

We wrapped up the first edition recently and we'll definitely be doing more.

Chakra has changed...A lot.

Seven years is a long time in frontend.

React changed.

Browsers changed.

CSS changed.

The way we think about component architecture changed.

And Chakra had to change with it.

There have essentially been several versions of what "Chakra UI" means.

v0.8

Early Chakra was heavily influenced by Styled System.

This was the period where many of the ideas people would eventually associate with Chakra were taking shape. Chakra was wrapped in the @chakra-ui/core packagae.

Chakra UI | Getting Started

Simple, Modular and Accessible UI Components for your React Applications. Built with Styled System

favicon v0.chakra-ui.com

v1

v1 was a major step.

The project was becoming more mature. We had more developers using it and more product teams depending on our library.

Components - Chakra UI

Simple, Modular and Accessible UI Components for your React Applications.

favicon v1.chakra-ui.com

v2

Then came Chakra v2.

This is probably the version a lot of current Chakra developers first encountered.

Installation - Chakra UI

How to install and set up Chakra UI in your project

favicon v2.chakra-ui.com

By this point Chakra was a mature component library.

But behind the scenes, the team was also exploring completely different ways of solving some of the problems Chakra had.

This led to one of the biggest decisions in Chakra's history.

v3.

The launch of Chakra UI v3 broke things.

There's no fancy way to say that 😅

It was a major rewrite, and there were very good reasons for many of the decisions we made. Chakra had accumulated years of APIs, abstractions and technical decisions. Some things needed to change if we wanted the library to move forward.

But knowing why something needs to change doesn't make the migration any less painful for the developer whose application was working perfectly fine yesterday.

That was something we had to take seriously.

We spent a lot of time on education.

Migration guides.

Documentation.

Examples.

Videos.

Community conversations to answer questions.

And even with all of that, there was still some friction.

Some developers were excited about the new direction and others were frustrated.

Sometimes the decision that makes the most sense for the future of the project creates more work for the people using it today.

I think v3 reinforced something for me about DevRel.

When the direction of your project changes, that's when the relationship you've built with your community really gets tested.

Moving with AI

When we first released Chakra in 2019, there wasn't AI. At least, not the way we know it today. In the past few years, we've also had to think about what Chakra looks like in an AI-first development world.

Developers no longer come to the docs to copy code anymore. They're asking Claude, Cursor and other coding agents to build interfaces for them.

So we've had to make Chakra easier for AI agents to understand too.

We've shipped an MCP Server, added AI Skills, and we've made our docs more agent-friendly with llms.txt.

It's still early, but I think this will become a much bigger part of how we think about developer experience.

The developer isn't always the only one reading your docs anymore.

So how did we scale from 0 to 6.1 million?

I've been trying to answer this while writing this post, and I don't think there is a satisfying growth-hack answer.

But if you've gone through the entire post, I'm sure you'd have a pretty good idea to that.

One thing we did really well over the years was consistently create content around what we shipped.

For almost every component, there's documentation and examples showing developers how to use it.

For major releases, we'd usually go further. A blog post, video, updated docs, demos and sometimes a livestream.

Here we are in September 2026, and we're still building!

I don't know what Chakra will look like seven years from now.

Given the difference between Chakra in 2019 and Chakra today, I wouldn't even try to predict it!

Happy 7th, Chakra UI 💙

Chakra Community

Top comments (1)

Collapse
 
eternaclarity profile image
Jesse Gamble •

The part I'd underline is the v3 honesty. Knowing the change is right doesn't make it less painful for the people depending on you, and how you handle that moment is the whole relationship.