7 Repos
Comprehensive toolkits for building accessible, complex interface patterns.
Distinguishing note: Focuses on the toolkit level for accessible interactions, distinct from individual accessibility utilities.
Explore 7 awesome GitHub repositories matching user interface & experience · Accessible Interaction Toolkits. Refine with filters or upvote what's useful.
This project is a declarative drag-and-drop library designed for building accessible and fluid interface interactions within web applications. It provides a component-based interface for managing complex list reordering and spatial relationships between elements, utilizing a specialized state container to coordinate movement logic. The library distinguishes itself through a focus on accessibility, maintaining a live connection between visual drag states and the browser accessibility tree to support screen readers and keyboard navigation. It optimizes performance by bypassing standard componen
Provides specialized components to ensure complex mouse and keyboard-driven interface patterns remain usable for all.
React-admin is a framework for building data-driven administrative interfaces that connect to REST or GraphQL backends. It provides a comprehensive suite of tools for managing the full lifecycle of administrative applications, including resource-oriented routing, declarative form scaffolding, and context-driven state management. By utilizing a modular adapter-based architecture, the framework abstracts backend communication, allowing developers to build consistent CRUD interfaces that handle data fetching, authentication, and synchronization automatically. The project distinguishes itself thr
Provides headless hooks and controllers for managing state and API interactions without enforcing a specific visual design.
This project is a Material Design UI library and Angular component framework. It provides a collection of reusable UI building blocks and development tools for creating consistent web applications that follow Material Design specifications. The framework includes an accessible web component library that uses headless directives and WAI-ARIA patterns to ensure user interface elements meet web accessibility standards. It also provides specialized integration wrappers for embedding and managing interactive Google Maps and YouTube video playback. The project supports custom UI component developm
Provides a headless toolkit for implementing complex and accessible interface patterns.
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
Offers a comprehensive toolkit for building complex interface patterns with built-in accessibility logic.
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
Provides a toolkit of React components that handle ARIA attributes and focus management automatically.
Zag ist eine Headless-UI-Zustandsmaschinenbibliothek, die ungestylte Komponentenlogik bereitstellt, um konsistentes Verhalten über verschiedene Rendering-Engines hinweg sicherzustellen. Sie fungiert als Toolkit zur Modellierung komplexer User-Interface-Interaktionen unter Verwendung von Statecharts und entkoppelt die zugrunde liegende Logik und Accessibility-Attribute vom visuellen Styling. Die Bibliothek ist framework-agnostisch und nutzt spezialisierte Adapter, um ihre Zustandsmaschinenlogik mit verschiedenen JavaScript-Bibliotheken wie React, Solid, Vue und Svelte zu verbinden. Dieser Ansatz ermöglicht es Entwicklern, ein einheitliches Interaktionsmodell beizubehalten, während sie jede CSS- oder Styling-Lösung durch zustandsgesteuerte Datenattribute anwenden können. Zag deckt ein breites Spektrum an funktionalen Bereichen ab, einschließlich umfassendem Accessibility-Management für Tastaturnavigation und ARIA-Attribute sowie eine riesige Sammlung interaktiver Primitiven. Dazu gehören Input-Controls, Navigationselemente wie Menüs und Tabs, Overlay-Komponenten wie Dialoge und Popovers sowie komplexe Medienhandhabung für Bildzuschnitt und Signaturerfassung. Es bietet zudem Utilities für hierarchisches Datenmanagement, asynchrone Listenbehandlung und ein System zur Konstruktion geführter Produkttouren.
Provides a comprehensive toolkit for implementing complex, accessible interface patterns across different rendering engines.
Precedent is a Next.js application starter and component library providing a foundational set of pre-configured tools and primitives for building production-ready web interfaces. It serves as a toolkit for bootstrapping applications with integrated authentication, analytics, and a collection of opinionated UI components. The project distinguishes itself through a Tailwind CSS UI kit that combines accessibility primitives and motion libraries to create polished interfaces. It includes a server-side image generator for programmatically creating dynamic social sharing images and preview visuals
Combines styling and accessible primitives with motion libraries to create polished interactive experiences.