Custom Rules

By default, the Dev Tool runs only WCAG 2.0, 2.1, and 2.2 rules at Level A, AA, and AAA. You can add more rule sets so the audit also checks other standards or focuses on specific topics (e.g. color, forms, or keyboard). This page explains how to enable those additional rules and what options are available.

Why add more rules?

WCAG covers a wide range of success criteria, but you may need checks from other standards (e.g. Section 508, EN 301 549) or from best-practice and category-based rule sets. Enabling them gives you more findings and helps you meet internal or legal requirements beyond WCAG. Findings from these rule sets appear in the same panel; they often have no WCAG level and show under the “Other” level filter.

Configuring additional rules

Pass the additionalRules prop when you render the Dev Tool. It accepts an array of rule-set identifiers. Each identifier enables a group of related checks. The default WCAG set always runs; additionalRules adds more on top.

tsx

import { AccessKitDevTools } from "@accesskit/react";

export function Layout({ children }: { children: React.ReactNode }) {
  return (
    <>
      {children}
      {process.env.NODE_ENV === "development" && (
        <AccessKitDevTools
          routeKey={pathname}
          additionalRules={["best-practice", "section508"]}
        />
      )}
    </>
  );
}

You can combine multiple entries. For example, use ["best-practice", "section508"] to add recommended best-practice checks and Section 508 rules. For the full list of supported identifiers, see Configuration or the TypeScript page (AccessKitAdditionalRuleTag).

Types of additional rule sets

Additional rule sets fall into two groups:

Standards list
Tag	Description
best-practice	Deque best-practice recommendations (not tied to a specific WCAG level).
section508	U.S. Section 508 (federal accessibility standard).
ACT	W3C Accessibility Conformance Testing Rules.
EN-301-549	European standard for ICT accessibility.
TTv5	Trusted Tester v5 (U.S. Section 508 testing methodology).
RGAAv4	French government accessibility guidelines (RGAA v4).
experimental	Experimental rules that may have false positives or change between axe-core versions.

Categories List
Tag	Description
cat.color	Color and contrast rules.
cat.forms	Form labels, placeholders, autocomplete, and error handling rules.
cat.aria	Correct use of ARIA attributes, roles, and states
cat.keyboard	Focus order, focus visibility, tabindex, and keyboard trap rules.
cat.name-role-value	Accessible names, correct roles, and sensible values (WCAG 4.1.2-style checks)
cat.structure	Headings, landmarks, lists, and document structure rules.
cat.tables	Table headers, scope, captions, and association rules
cat.text-alternatives	Alt text, labels, and alternatives for non-text content.
cat.sensory-and-visual	Presentation, layout, and sensory characteristic rules
cat.time-and-media	Captions, transcripts, auto-playing content, and timing rules
cat.language	Page language and language-change rules
cat.parsing	Valid HTML (e.g. duplicate IDs, well-formed markup).
cat.other	Rules that don't fit the other categories

Findings from additional rules

Findings from additional rule sets show a rule ID, message, severity, and fix guidance (the same as any other finding). Most additional rules (TTv5, RGAAv4, Section 508, etc.) overlap with WCAG criteria, so they still have a WCAG level (A/AA/AAA) and appear under those level filters. The Dev Tool displays standard badges (e.g. TTv5, RGAAv4) next to each finding's rule ID so you can see which standards it belongs to. A small number of rules (e.g. region, skip-link) are tagged only as best-practice under a standard like RGAAv4 and have no WCAG level; these appear under the "Other" level filter. You can also search by standard name (e.g. typing "TTv5") to filter findings.

Programmatic audits

If you run audits in code (e.g. in tests or scripts) with runAccessibilityAudit, you can pass the same kind of options so those runs use the same rule sets as the Dev Tool. See the TypeScript page for RunAccessibilityAuditOptions and the optional tags for additional rules.

For the exact prop name and full list of identifiers, see Configuration. For types and programmatic usage, see the TypeScript page.