First and foremost, thank you to everyone who has contributed to styled-components over the years. Open Source is hard work, and many of the larger feature and/or refactoring drives probably would never have shipped without your support!
As I write this in 2025, styled-components as a project is in "maintenance mode". There are a number of reasons for this:
The React core team has decided to defacto-deprecate certain APIs like the Context API (not available in RSC with no migration path.)
The ecosystem in general has largely moved on from css-in-js as a concept while other technologies like tailwind have absolutely exploded in popularity.
quantizor (me, the core maintainer for styled-components since ~2018) no longer has active production deployments of styled-components in larger applications, so context of usage in real products will continue to wane and eventually cease altogether.
There are many ways to do OSS, and I made a decision early-on that the library would not fundamentally change its API or capabilities. When you adopt a library, one of the most annoying things a maintainer can do is change everything and cause a massive migration burden. Accordingly, styled-components will not remove APIs like use of React Context and will continue to be available with occasional bugfixes and misc improvements to support the existing user base.
For new projects, I would not recommend adopting styled-components or most other css-in-js solutions. Given the current ecosystem dynamics, I don't feel comfortable continuing to collect donations for this project. Existing subscription tiers have been removed as of today and any recurring donations cancelled. We have a small war chest that will fund ongoing maintenance work as-needed and bug bounties may be issued from time to time for particular issues.
Thank you for your understanding, quantizor and the styled-components team
Oh! For me styled-components is the natural way to create web apps... It has been for years. I tried tailwind several times though... Should I learn all those classes to write css? And convince our designers to remake their mockups to fit tailwind styles? Okay, I will try...
tailwind exploded in trends mainly because people have to google utility classes every time they need to write styles ;) But in general I agree that it's insanely popular now. I switched to it recently too, because it allows to write adaptive styles much faster.
With styled-components I really enjoyed ability to write native css rules in a clean way, and it was very smooth learning curve compared to tailwind. I think styled-components might still be a good choice for critical, reusable UI parts, like UI Kit elements. Tailwind has some issues with extensibility, that's why projects like tw-merge exist, but it has it's downsides and limitations too.
wow, I'm glad I've not overlooked the email in my inbox with this post. What can I say. CSS-in-JS made a massive change in React's world and FE development overall. And `styled-components` played a significant role in that change.
Thank you for all your efforts and absolute transparency regarding path forward.
We at digitec galaxus are still embracing CSS-in-JS - and we heavily used styled-components since the beginning of our new frontend stack ~7 years ago. Now we have developed our own open source solution called "next-yak", which can act almost as a drop-in replacement for styled-components: https://yak.js.org/
Oh! For me styled-components is the natural way to create web apps... It has been for years. I tried tailwind several times though... Should I learn all those classes to write css? And convince our designers to remake their mockups to fit tailwind styles? Okay, I will try...
My opinion from implementing and maintaining a design system for the last 3 years or so: I think it would be ideal for developers to not have to worry about styling at all. It was a goal of ours to enable developers to write frontend code without writing CSS. A design system (or a collection of components akin to a design system) would abstract this away from them. The components you build for the design system can use whatever styling solution you want. In my new project I opted for css-hooks which has been neat.
Regarding your point of "learning all the classes to write CSS", I don't think you need to learn them ahead of time, you can simply look up the docs when you need to find the Tailwind equivalent. (This is a downside of using Tailwind as opposed to css-hooks or something similar.) I believe there are IDE extensions for autocompleting Tailwind classes too.
Lastly regarding your point of "designers making mockups fit tailwind styles", I do not know why that would be at all the approach to take. Designers should make their mockups as they do (e.g. in Figma) and you figure out the Tailwind classes necessary to support it. If you are regularly writing custom CSS every time a new design comes through then you probably don't have a set of standardized components so there's not much of a time loss. You can customize Tailwind pretty extensively.
In the product I am working on, we wrap our React application into Custom HTML Elements. We went all in with Styled-components because it's the only option out there that supports scoping the styles to our shadow roots properly. So sad this has to go. Styled-components was my favorite option out there. Tailwind like options don't work properly in my context. Any suggestion of alternative?
Yes, @sebastien-belzile we have the alternative - also open source: https://yak.js.org/ Would be great to see more people trying it out, it is basically styled-components but in build-time and on steroids (it's done with SWC and Rust)
I just started using https://www.restyle.dev. Love it! It's only 5kb, and very similar API to styled-components... Afaik doesn't use React Context either, and works very smoothly for SSR.
I think it needs to be heard around, thus I share here.
I really enjoyed how styled-component made abstract projects for me and too pity it’s discontinued. I think alternative approaches make sense for developers.
What is your news source for this item? Would this change also effect a CSS-in-JS solution like Emotion? > The React core team has decided to defacto-deprecate certain APIs like the Context API (not available in RSC with no migration path.)
on