headless UI component library

Reach UI is an open-source library of accessible, low-level React components designed to serve as a foundation for building design systems and interactive user interfaces. It is an accessibility-first toolkit that handles core concerns like ARIA attributes, focus management, and screen reader support automatically, without requiring developer configuration. The library is built as a collection of standalone packages, each managing its own lifecycle and dependencies, enabling granular adoption and tree-shaking. Components use a polymorphic rendering pattern, accepting an as prop to render as

Primitives is a library of unstyled, accessible building blocks designed for creating complex interface elements in React. It functions as a headless component framework, providing the underlying logic, state management, and accessibility compliance while leaving all visual styling and design decisions entirely to the developer. The library distinguishes itself through a composition-based architecture that allows developers to build interactive interfaces by nesting small, single-purpose components. This system automatically handles complex requirements such as WAI-ARIA attribute injection, f

Base UI is a headless component library and unstyled framework providing accessible interface primitives. It decouples behavioral logic and state management from the visual layer, allowing developers to implement complex UI patterns while maintaining total control over the final styling. The library implements WAI-ARIA design patterns to ensure all primitives support standard keyboard navigation and screen reader accessibility. It provides a suite of low-level building blocks that handle the internal mechanics of interface elements without bundling any CSS. The framework covers a broad range

Downshift is a headless UI component library and framework for React that provides the state and interaction primitives necessary to build accessible autocomplete, combobox, and select dropdown components. It functions as a WAI-ARIA UI framework, generating the required ARIA attributes and keyboard event handlers to ensure screen reader compliance without providing any default styling. The library utilizes a headless component pattern to decouple interaction logic from the visual presentation. It manages complex state transitions through reducers and synchronizes internal UI state with extern

Ariakit is a headless component library and accessible UI component toolkit. It provides a set of unstyled web components with built-in accessibility patterns to ensure that screen readers and keyboard navigation function correctly. The project includes an adaptive color engine that calculates high-contrast text and dynamic surface colors for light and dark modes. It also features a concentric layout engine for computing nested padding, margins, and border radii for circular interface elements, alongside a design token system for managing global CSS variables. The toolkit covers broad capabi

Zag is a headless UI state machine library that provides unstyled component logic to ensure consistent behavior across different rendering engines. It functions as a toolkit for modeling complex user interface interactions using statecharts, decoupling the underlying logic and accessibility attributes from visual styling. The library is framework-agnostic, utilizing specialized adapters to bridge its state machine logic with various JavaScript libraries such as React, Solid, Vue, and Svelte. This approach allows developers to maintain a single interaction model while applying any CSS or styli

This project is an accessible modal component for React applications. It provides a dialog window that overlays main content and manages keyboard focus to ensure compatibility with assistive technologies. The component integrates a portal wrapper to render modal content into a separate DOM node, avoiding layout nesting issues. It uses a focus-trapping system to restrict keyboard navigation to the dialog window and prevent users from tabbing into background page content. The library covers visibility control, custom portal mounting, and visual styling for dialog windows and overlays. It also

Grommet is a React UI framework and accessible component library designed for building themed user interfaces. It provides a responsive design system and a themed interface toolkit to ensure inclusive user experiences across various screen sizes and device orientations. The framework emphasizes accessible UI development by providing pre-styled elements that follow web accessibility standards for screen readers and keyboard navigation. It enables the implementation of custom themes through a centralized system that manages visual styles and design tokens. The toolkit covers responsive web des

This project is a design system component library and adaptive UI framework based on Adobe's Spectrum design system. It provides a collection of accessible React components designed to create consistent user experiences through a standardized set of adaptive and themeable interface elements. The framework features a responsive scale system that automatically optimizes touch targets and component sizing for mobile and desktop contexts. It is built as a tree-shakable library, allowing for the import of only the specific components used to minimize the final JavaScript and CSS bundle size. The

cmdk is an unstyled, headless React component library for building accessible search-based navigation and command interfaces. It provides the logic and state management required to create keyboard-navigable command palettes that filter lists of actions and items based on user input. The library distinguishes itself by remaining visually agnostic, offering a collection of logic-heavy components without predefined styles. It supports advanced organization through hierarchical menu navigation, nested paging systems, and conditional group filtering that hides categories when no child items match

Semantic UI React is a declarative component library that provides native React bindings for the Semantic UI design language. It enables the construction of complex user interfaces through a modular, component-based architecture that maps directly to established design patterns, allowing developers to build consistent web application layouts without manual HTML markup. The library distinguishes itself through a shorthand property system that automatically generates and populates nested child components from data objects, significantly reducing the need for verbose code. It also supports polym