Check Web Accessibility Online
Web accessibility compliance is both a legal requirement in many jurisdictions and a fundamental aspect of building inclusive products. Common accessibility failures — insufficient colour contrast, font sizes too small to read, and poorly structured headings — can be caught early with the right tools. devtoolkit.sh provides a set of client-side accessibility checkers that evaluate your design decisions against WCAG 2.1 AA and AAA criteria. Check foreground-background colour pairs for contrast ratios, verify font sizes meet readability guidelines, and analyse heading structure for correct hierarchy. Catch these issues before they reach users and before accessibility audits flag them.
Check foreground/background color contrast ratio against WCAG standards.
Check font sizes against WCAG accessibility guidelines for body, headings, and mobile.
Extract and validate H1–H6 heading hierarchy from HTML.
FAQ
- What contrast ratio is required for WCAG AA compliance?
- WCAG 2.1 AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (18pt or 14pt bold). AAA requires 7:1 for normal text and 4.5:1 for large text.
- What is the minimum font size for accessibility?
- WCAG does not specify a minimum pixel size, but 16px is widely accepted as the baseline for body text. Text smaller than 14px is generally considered difficult to read for users with low vision.
- Why does heading structure matter for accessibility?
- Screen reader users navigate pages by heading structure. Skipping levels (e.g., going from h1 to h4) or using headings for visual styling rather than structure makes navigation confusing and non-compliant with WCAG 1.3.1.