awesome-repositories.com
Blog
MCP
awesome-repositories.com

Discover the best open-source repositories with AI-powered search.

ExploreCurated searchesOpen-source alternativesSelf-hosted softwareBlogSitemap
ProjectMCP serverAboutHow we rankPress
LegalPrivacyTerms
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
tailwindlabs avatar

tailwindlabs/headlessui

0
View on GitHub↗
28,619 stars·1,204 forks·TypeScript·MIT·45 viewsheadlessui.com↗

Headlessui

Headless UI is a headless component library and accessible UI component kit that provides logic-only interface elements. It functions as a state-driven UI framework designed to provide functionality without prescribing any specific visual styles.

The library is specifically designed for integration with Tailwind CSS, enabling the implementation of custom design systems. It allows users to apply visual styles to components based on whether they are active, selected, or open.

The project covers the development of accessible UI components that meet ARIA standards and include built-in keyboard navigation. It handles the mapping of internal component state to accessibility attributes while leaving full control over the HTML and CSS to the consumer.

Features

  • Headless Logic Wrappers - Provides logic-only component wrappers that leave all visual styling to the consumer via CSS classes.
  • Keyboard Navigation Interception - Intercepts specific keystrokes to trigger state transitions and manage focus for complex UI patterns.
  • Accessible UI Components - Provides interface elements with built-in ARIA attributes and keyboard support that are compatible with any styling.
  • Accessible Component Suites - Offers a suite of components engineered with built-in accessibility standards and keyboard navigation.
  • Unstyled Tailwind Components - Provides a set of unstyled, accessible components designed for seamless integration with Tailwind CSS.
  • Tailwind CSS Integration - Integrates directly with Tailwind CSS utility classes to give developers complete design control.
  • Focus Management - Provides programmatic control over input focus to ensure logical navigation and prevent keyboard traps.
  • Web Accessibility Compliance - Ensures web components comply with ARIA standards and accessibility requirements.
  • Headless UI Components - Provides a library of logic-only UI components that do not enforce any specific visual styles.
  • State-Based Styling Hooks - Allows applying specific visual styles based on whether a component is currently active, selected, or open.
  • Accessibility Attribute Mapping - Maps internal state directly to ARIA attributes to ensure accessibility without prescribing visual styles.
  • Design System Implementations - Enables the implementation of custom design systems by providing the underlying interaction logic.
  • Context State Propagators - Uses the provider pattern to share component state across nested elements for visual and accessibility synchronization.
  • Render Props - Implements a declarative render prop pattern to expose internal component state for custom UI rendering.
  • State-Driven UI Controllers - Functions as a system for tracking and styling UI elements based on their active or open states.
  • Component Libraries - Completely unstyled, accessible UI components.
  • UI Components and Libraries - Unstyled and accessible UI components for web applications.

Star history

Star history chart for tailwindlabs/headlessuiStar history chart for tailwindlabs/headlessui

How this analysis was created: This summary and feature list were written by an AI model that read the project's README and public documentation pages. Each feature links to the documentation it came from; stars, license and language come straight from the GitHub API. The model does not read the source code, and the analysis is refreshed when the project is re-analysed. Learn more on our About page.

AI search

Explore more awesome repositories

Describe what you need in plain English — the AI ranks thousands of curated open-source projects by relevance.

Start searching with AI

Frequently asked questions

What does tailwindlabs/headlessui do?

Headless UI is a headless component library and accessible UI component kit that provides logic-only interface elements. It functions as a state-driven UI framework designed to provide functionality without prescribing any specific visual styles.

What are the main features of tailwindlabs/headlessui?

The main features of tailwindlabs/headlessui are: Headless Logic Wrappers, Keyboard Navigation Interception, Accessible UI Components, Accessible Component Suites, Unstyled Tailwind Components, Tailwind CSS Integration, Focus Management, Web Accessibility Compliance.

What are some open-source alternatives to tailwindlabs/headlessui?

Open-source alternatives to tailwindlabs/headlessui include: downshift-js/downshift — Downshift is a headless UI component library and framework for React that provides the state and interaction… mui/base-ui — Base UI is a headless component library and unstyled framework providing accessible interface primitives. It decouples… radix-vue/shadcn-vue — shadcn-vue is a collection of accessible and unstyled UI components for Vue. It serves as a design system foundation… ariakit/ariakit — Ariakit is a headless component library and accessible UI component toolkit. It provides a set of unstyled web… unovue/reka-ui. angular/components — This project is a collection of reusable UI component libraries for the Angular framework. It serves as an…

Open-source alternatives to Headlessui

Similar open-source projects, ranked by how many features they share with Headlessui.
  • downshift-js/downshiftdownshift-js avatar

    downshift-js/downshift

    12,295View on GitHub↗

    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

    JavaScriptaccessibleautocompleteautosuggest
    View on GitHub↗12,295
  • mui/base-uimui avatar

    mui/base-ui

    8,711View on GitHub↗

    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

    TypeScriptaccessibilitydesign-systemreact
    View on GitHub↗8,711
  • radix-vue/shadcn-vueradix-vue avatar

    radix-vue/shadcn-vue

    10,128View on GitHub↗

    shadcn-vue is a collection of accessible and unstyled UI components for Vue. It serves as a design system foundation and a port of Radix UI primitives to the Vue ecosystem, focusing on providing a base for highly customizable web interfaces. The project utilizes a template-driven distribution model, delivering raw source code via a CLI rather than a compiled library. This allows for the direct modification of components using Tailwind CSS utility classes to establish a unique visual identity. The library covers accessible component architecture and custom design system implementation. It pro

    TypeScript
    View on GitHub↗10,128
  • ariakit/ariakitariakit avatar

    ariakit/ariakit

    8,573View on GitHub↗

    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

    TypeScripta11yaccessibilityaccessible
    View on GitHub↗8,573
  • See all 30 alternatives to Headlessui→