Base UI

​Radix UI is an open source component library optimized for fast development, easy maintenance, and accessibility. It offers two main packages, Radix Primitives and Radix Themes. Radix Primitives is a low-level UI component library focused on accessibility, customization, and developer experience. Components adhere to WAI-ARIA design patterns, are unstyled by default, and provide full keyboard navigation. Radix Themes is a pre-styled component library designed to work out of the box with minimal configuration. It includes layout primitives, typography, and components like buttons and cards, all customizable via the Theme component. Radix Colors offers a comprehensive, accessible color system for designing beautiful, accessible websites and apps. It supports automatic dark mode, transparent variants, and is designed for user interfaces. Radix Icons provides a crisp set of 15×15 icons available as individual React components.

​Headless UI is a library of completely unstyled, fully accessible UI components designed to integrate seamlessly with Tailwind CSS. It offers a range of components for both React and Vue. These components are built with accessibility in mind, adhering to WAI-ARIA design patterns and providing full keyboard navigation support. Because they are unstyled by default, developers have complete control over the look and feel, allowing for easy customization to match any design system. Headless UI components expose state information through data attributes and render props, enabling developers to conditionally apply styles based on component states such as focus, open, selected, or disabled. This approach ensures that the components are both flexible and accessible, making them suitable for building custom, high-quality user interfaces. With Headless UI, developers can create complex UI elements like modals, dropdowns, and tabs without sacrificing accessibility or design flexibility.