TL;DR

Shadcn/UI has changed its default component styling framework from Radix to Base UI. This shift impacts developers relying on the default setup, with further details pending.

Shadcn/UI has officially switched its default component styling framework from Radix to Base UI, a move confirmed by the project’s maintainers. This change affects developers who rely on the default setup for faster integration and styling, making it a noteworthy update in the UI component ecosystem.

The change was announced on the project’s official repository and communication channels earlier this week. Previously, Shadcn/UI defaulted to Radix, a popular library for accessible, unstyled components, which developers could then style using Shadcn/UI. Now, the default configuration has shifted to Base UI, a different design system that emphasizes pre-styled components and a more opinionated approach.

According to the maintainers, this update aims to streamline development workflows by providing a more integrated styling experience out of the box. The switch is described as a default setting change, but developers can still customize their setups to revert to Radix if desired. The decision was influenced by feedback from the community and the evolving landscape of UI design systems.

It is not yet clear whether this change will be permanent or if future updates might allow toggling between Base UI and Radix more seamlessly. The project documentation now emphasizes Base UI as the default, but support for Radix remains available for those who prefer it.

At a glance
updateWhen: announced March 2024
The developmentShadcn/UI now defaults to Base UI instead of Radix, marking a significant change in its configuration for developers.

Implications for Developers Using Shadcn/UI Defaults

This development matters because many developers depend on the default configuration of Shadcn/UI for rapid prototyping and consistent styling. Switching the default from Radix to Base UI could influence how projects are structured, especially for teams that relied on Radix’s unstyled, accessible components for custom styling. The change may also signal a broader shift in the ecosystem towards opinionated, integrated design systems, impacting future development patterns and library integrations.

For existing projects, this update might require adjustments to component imports and styling conventions. For new projects, developers will now start with Base UI as the baseline, which could affect the learning curve and customization options. Overall, this move could accelerate adoption of Base UI but might also create initial friction for teams accustomed to Radix.

Amazon

React UI component libraries

As an affiliate, we earn on qualifying purchases.

As an affiliate, we earn on qualifying purchases.

Background on Shadcn/UI and Its Component Frameworks

Shadcn/UI is a popular open-source library that provides pre-built, accessible UI components for React applications. Originally, it was designed to work seamlessly with Radix, a library known for unstyled, accessible components that developers could style as needed. Radix’s flexibility made it a common choice for custom UI development, and Shadcn/UI leveraged this by providing a streamlined way to incorporate Radix components with minimal setup.

Over recent months, the library’s maintainers have explored alternative design systems, including Base UI, which offers a more opinionated set of pre-styled components. The recent announcement marks a notable shift in the default configuration, reflecting a strategic move to align with Base UI’s ecosystem. The transition aligns with broader industry trends favoring integrated, styled component libraries that reduce setup time.

Until now, Radix remained the default, but the recent change indicates a possible reorientation towards more opinionated styling solutions, possibly to streamline developer workflows or improve consistency across projects.

“We have shifted the default setup of Shadcn/UI from Radix to Base UI to better serve the needs of modern development workflows.”

— Shadcn/UI Maintainers

Amazon

accessible UI component kits

As an affiliate, we earn on qualifying purchases.

As an affiliate, we earn on qualifying purchases.

Unconfirmed Aspects of the Default Switch Impact

It is not yet clear whether this change will be permanent or if future updates will allow easier toggling between Base UI and Radix. The long-term impact on existing projects and how this might influence other libraries remains to be seen. Additionally, the community is awaiting detailed documentation on migration strategies for projects that relied heavily on Radix by default.

Amazon

pre-styled React components

As an affiliate, we earn on qualifying purchases.

As an affiliate, we earn on qualifying purchases.

Next Steps for Developers and Project Maintainers

Developers should review the updated documentation to understand the new default setup and how to customize or revert to Radix if needed. The maintainers are expected to release further guidance on migration and best practices in the coming weeks. Additionally, community discussions and feedback will likely shape future updates, possibly leading to more flexible configuration options or alternative default configurations.

For ongoing projects, teams should evaluate whether the new default aligns with their development workflows and plan adjustments accordingly. Monitoring the project’s GitHub repository and official channels will be essential for staying informed about subsequent updates and support options.

Amazon

UI design system for React

As an affiliate, we earn on qualifying purchases.

As an affiliate, we earn on qualifying purchases.

Key Questions

Why did Shadcn/UI switch its default from Radix to Base UI?

The maintainers stated that the move aims to streamline development workflows by providing a more integrated styling experience out of the box, reflecting community feedback and evolving industry trends.

Can I still use Radix with Shadcn/UI after this change?

Yes, support for Radix remains available. Developers can customize their setups to revert to Radix or use it alongside Base UI, depending on their project needs.

Will this change affect existing projects?

Existing projects that rely on the default Radix setup will not be affected immediately, but future updates may require adjustments if they adopt the new default configuration.

Is this a permanent change?

It is not yet clear whether the shift to Base UI as the default will be permanent or if future versions will allow toggling more easily. The community is awaiting further clarification from the maintainers.

What should developers do now?

Developers should review the updated documentation, evaluate their project setups, and stay informed about upcoming updates from the Shadcn/UI team for best practices and migration support.

Source: hn

You May Also Like

Sovereignty Is a Pipe, Not a Passport

Mistral claims European data sovereignty by hosting models in EU infrastructure, but reliance on US cloud providers complicates this claim under CLOUD Act jurisdiction.

A War Room for Your Next Idea: Inside IdeaClyst

Discover how IdeaClyst transforms your idea process with a digital war room that organizes, debates, and fine-tunes your concepts — all on your own machine.

The Compute Reckoning: Anthropic Finally Admits What Customers Suspected for Ten Months

Anthropic reveals that recent customer experience issues were due to compute shortages, now addressed by a major partnership with SpaceX and other providers.

Claude Code as a Daily Driver: Claude.md, Skills, Subagents, Plugins, and MCPs

Exploring how advanced users leverage Claude.md, subagents, plugins, and MCPs for efficient, programmable AI workflows in daily coding tasks.