MUI Releases Base UI 1 with 35 Accessible Components

MUI has released Base UI 1.0, bringing production-ready stability to its unstyled React component library after two years of development. The release introduces 35 accessible components, a package rename from @base-ui-components/react to @base-ui/react, and a commitment to long-term maintenance from MUI's dedicated team.

The 1.x release delivers several refinements to the developer experience, including improved component APIs based on lessons learned from Radix UI, enhanced accessibility features across all components, and performance optimizations. The library integrates seamlessly with popular styling solutions like Tailwind CSS, CSS Modules, and CSS-in-JS libraries.

Developers building with Base UI benefit from its headless architecture, which provides full control over styling while maintaining robust accessibility features. Unlike traditional component libraries that bundle opinionated styles, Base UI components come completely unstyled, allowing teams to implement their own design systems without fighting against default CSS. The components handle complex interaction patterns, keyboard navigation, focus management, and ARIA attributes, ensuring WCAG compliance out of the box while giving developers the freedom to style components however they choose.

The project distinguishes itself from competitors like Radix UI and Headless UI through its backing and long-term commitment. While Radix UI faced uncertainty after its acquisition, Base UI is supported by MUI, a company with engineers, designers, and managers dedicated to the project. This has generated confidence in the React community, with developers on Hacker News praising the stability and expressing enthusiasm for adoption.

On Reddit, a user asked why the release is being branded as a successor to Radix: Curious as to why you are branding it as a successor to Radix? Specifically what was wrong with Radix that needed a whole new UI lib? To which a reply explained the reasoning: It's to communicate that it's easy to migrate from Radix to Base UI due to the API similarity.

For developers considering using Base UI, a question from a user comparing to Ariakit or React Aria was asked on the same Reddit announcement thread: Why would I use this instead of Ariakit or React Aria? What does it provide that the others don't? A Base UI maintainer (_doodack) replied: React Aria has quite a different API. Some devs love it, some don't. It renders a large number of context providers in the React tree and can be challenging to mix and match with other component libraries. Our API is much more similar to Radix and Ariakit. They go onto say: We also have some features not found anywhere else, like "detached triggers" - useful for example for reusing the same popup element across different triggers

Base UI 1.0 also brings numerous component-specific improvements that address edge cases and enhance reliability. The Combobox component now properly respects the itemToStringValue for form submissions and accepts null as an option for the value prop. The Menu component fixes issues where submenus would open with zero delay and ensures focus correctly returns to the trigger when pressing Escape. The Select component received similar improvements for form handling and null value support.

Performance enhancements were also implemented across the board, with particular attention paid to reducing unnecessary re-renders and improving runtime efficiency.

Base UI is an open-source React component library maintained by MUI and core contributors from the Radix and Floating UI projects. It focuses on accessibility, composability, and developer experience, providing low-level hooks and unstyled components that work seamlessly with any styling solution. Base UI is designed for teams building custom design systems and applications where visual control and accessibility are equally important.

About the Author Daniel Curtis is a UI Development Manager at Griffiths Waite, a software consultancy based in Birmingham, UK. He leads front-end engineering efforts with a strong focus on delivering innovative enterprise solutions using TypeScript across the stack. Daniel is passionate about modern web architecture, developer experience, and the use of AI to both support software delivery and solve real customer problems within products.