Ariakit
/
This site is under construction Subscribe to updates

Components

ButtonTrigger an action or event, such as submitting a Form, opening a Dialog, canceling an action, or performing a delete operation in React. This component is based on the WAI-ARIA Button Pattern.
CheckboxSelect one or more options in a list or toggle a single option using a native or custom checkbox in React. This component is based on the WAI-ARIA Checkbox Pattern.
ComboboxFill in a React input field with autocomplete & autosuggest functionalities. Choose from a list of suggested values with full keyboard support. This component is based on the WAI-ARIA Combobox Pattern.
DialogOpen a new window that can be either modal or non-modal and optionally rendered in a React portal. This component is based on the WAI-ARIA Dialog Pattern.
DisclosureClick on a button to show (expand, open) or hide (collapse, close) a content element in React. This component is based on the WAI-ARIA Disclosure Pattern.
FormSubmit information with accessible interactive controls in React. Take advantage of the browser's built-in validation with screen reader support. This component is based on the WAI-ARIA Form Role.
HeadingAdd automatic hierarchy to your page contents so users can easily navigate them. This component is based on the WAI-ARIA Heading Role.
HovercardShow a Popover with additional information when users hover over an element.
MenuAccess a set of commands within a menu bar or dropdown menu. This component is based on the WAI-ARIA Menu Pattern and the WAI-ARIA Menu Button Pattern.
PopoverShow a popup dialog positioned relative to an anchor element. This component can be either modal or non-modal and optionally rendered in a React portal.
RadioChoose one option from a list of choices presented as radio buttons. This component is based on the WAI-ARIA Radio Group Pattern.
SelectSelect a value from a list of options presented in a dropdown menu, similar to the native HTML select element. This component is based on the WAI-ARIA Combobox Pattern.
TabDisplay one panel of content at a time with a tabbed interface. This component is based on the WAI-ARIA Tabs Pattern.
ToolbarGroup a set of related controls, reducing the number of tab stops in the keyboard interface. This component is based on the WAI-ARIA Toolbar Pattern.
TooltipDisplay information related to an anchor element when the element receives keyboard focus or the mouse hovers over it. This component is based on the WAI-ARIA Tooltip Pattern.
VisuallyHiddenHide an element visually but keep it available for screen readers and other assistive technologies.

Abstract components

CollectionTrack a collection of DOM elements in the exact order they're rendered in the DOM and watch the DOM for any change to their order.
CommandClick with a mouse or keyboard to trigger an action. This abstract component is based on the WAI-ARIA Command Role.
CompositeProvide a single tab stop on the page and navigate through the focusable descendants with arrow keys. This abstract component is based on the WAI-ARIA Composite Role.
FocusableClick or press Tab to move focus to any React element using this abstract component that normalizes the focus behavior across browsers.
PortalAttach an element to a DOM node outside the parent component's hierarchy.
RoleProvide the basic Ariakit features to any component. This abstract component is based on the WAI-ARIA RoleType Role.
SeparatorDistinguish sections of content or groups of Composite items. This abstract component is based on the WAI-ARIA Separator Role.