ARIA Roles Reference
Searchable reference of all ARIA roles
ARIA Roles Reference is a free online tool from BrowserUtils that searchable reference of all aria roles. It runs entirely in your browser — your data never leaves your device. No account required.
57 ARIA roles across 4 categories
banner<header>
Site-wide header, typically containing the logo and main navigation.
complementary<aside>
Supporting content related to the main content.
contentinfo<footer>
Footer region containing information about the page or site.
form<form>
A region containing a collection of form-related elements.
main<main>
The primary content of the page.
navigation<nav>
A collection of navigational links.
region<section>
A perceivable section of the page with a specific purpose.
search<search>
A region containing search functionality.
alert
A message with important, usually time-sensitive, information.
alertdialog
A dialog that contains an alert message requiring user response.
button<button>
An interactive element that triggers an action when activated.
checkbox<input type="checkbox">
A checkable input with true/false/mixed states.
combobox
A composite widget combining a text input with a listbox or grid popup.
dialog<dialog>
A window overlaid on the main content requiring user interaction.
gridcell
A cell in a grid or treegrid, optionally interactive.
link<a href>
An interactive reference to a resource.
listbox<select>
A widget that allows selecting one or more items from a list.
menu
A list of choices or actions offered to the user.
menubar
A menu that is usually presented horizontally.
menuitem
An option in a menu or menubar.
menuitemcheckbox
A menuitem with a checkable state.
menuitemradio
A menuitem in a group where only one can be checked.
option<option>
A selectable item in a listbox.
progressbar<progress>
A widget displaying the progress of a task.
radio<input type="radio">
A checkable input in a group where only one can be checked.
scrollbar
A graphical object controlling the scrolling of content.
slider<input type="range">
An input where the user selects a value from a range.
spinbutton<input type="number">
A numeric input that can be incremented/decremented.
switch
A type of checkbox that represents on/off values.
tab
A grouping label for a tabpanel.
tabpanel
A container for the content associated with a tab.
textbox<input type="text">
An input that allows free-form text.
tooltip
A contextual popup displaying a description for an element.
treeitem
An option item of a tree, which may be expanded or collapsed.
article<article>
A self-contained composition forming an independent part of a document.
cell<td>
A cell in a tabular container.
columnheader<th scope="col">
A header cell for a column in a table.
definition<dd>
A definition of a term or concept.
figure<figure>
A piece of self-contained content with an optional caption.
group<fieldset>
A set of user interface objects not in a page summary.
heading<h1>-<h6>
A heading for a section of the page.
img<img>
An element representing an image.
list<ul>, <ol>
A section containing listitem elements.
listitem<li>
A single item in a list.
math
Content representing a mathematical expression.
note
Supplementary content parenthetic or ancillary to the main content.
row<tr>
A row in a tabular container.
rowgroup<thead>, <tbody>, <tfoot>
A group of rows in a table.
rowheader<th scope="row">
A header cell for a row in a table.
separator<hr>
A divider separating sections of content.
table<table>
A section containing data arranged in rows and columns.
term<dt>
A word or phrase with a corresponding definition.
toolbar
A collection of commonly used function buttons or controls.
log
A live region where new information is added in a meaningful order.
marquee
Non-essential information that changes frequently.
status<output>
An advisory providing information that is not important enough for an alert.
timer
A numerical counter indicating the elapsed or remaining time.
How to use ARIA Roles Reference
- 1 Paste or type your input into the editor above.
- 2 The tool processes your data instantly — right in your browser, with nothing sent to a server.
- 3 Copy the result with one click or continue editing your input.
About ARIA Roles Reference
Free online ARIA roles reference. Browse and search all WAI-ARIA roles organized by category with descriptions and usage guidelines for accessible web development. This tool runs entirely in your browser — your data is never sent to a server. Just paste your input, get instant results, and copy with one click. No sign-up or installation required.
ARIA Roles Reference specs
- Runtime
- 100% client-side (browser)
- Built on
- WCAG 2.2 contrast formulas (relative luminance per W3C spec) and ARIA 1.2 role mappings
- Cost
- Free — no account, no rate limits, no usage caps
- Browser support
- Chrome 90+, Firefox 88+, Safari 14+, Edge 90+
- Part of
- 299 developer tools on BrowserUtils (100% client-side)
Questions
What are ARIA roles and why are they important?
ARIA roles define the type or purpose of an HTML element for assistive technologies like screen readers. They help convey the structure and behavior of web content to users who cannot see the visual presentation.
Should I use ARIA roles on native HTML elements?
Generally no. Native HTML elements like <nav>, <button>, and <main> already have implicit ARIA roles. The first rule of ARIA is to use native HTML elements whenever possible. Only add ARIA roles when no native element provides the semantics you need.
What are ARIA landmark roles?
Landmark roles (banner, navigation, main, complementary, contentinfo, search, form, region) identify major sections of a page. Screen reader users can jump directly between landmarks, making page navigation much faster.
How do I search for a specific ARIA role in this reference?
Type the role name or a keyword into the search field to filter the list. Roles are organized by category (widget, document structure, landmark) so you can also browse by type.
Does this ARIA roles reference work offline?
Yes. All role data is included in the page. Once loaded, searching and browsing works entirely in your browser with no internet connection required.
Comments
Related tools
More Accessibility
WCAG Contrast CheckerAlt Text GeneratorHeading Hierarchy CheckerReadability ScoreColor Safe PaletteLink Text CheckerFocus Order Visualizer
View all Accessibility tools
Comments