Accessibility / Analysis / Checka11y
Checka11y is a CSS-based accessibility visualization tool that highlights potential accessibility issues by adding visual overlays. It identifies elements with missing alt text, indicates focus states, shows heading hierarchy, reveals links that may be confusing, and highlights potential color contrast issues. Uses CSS injection for visual feedback. 1.4.3: Contrast (Minimum), 2.1.1: Keyboard, 2.4.1: Bypass Blocks, 2.4.2: Page Titled, 2.4.6: Headings and Labels.
WCAG SC 1.1.1: Non-text Content
Run Checka11y
Test run or drag to
bookmarklets bar to install
javascript:%21function()%7B%22use%20strict%22%3Btry%7Bvar%20e%3Ddocument.createElement(%22link%22)%3Be.rel%3D%22stylesheet%22%2Ce.href%3D%22https%3A%2F%2Fcdn.jsdelivr.net%2Fnpm%2Fchecka11y-css%402.5.0%2Fchecka11y.min.css%22%2Cdocument.head.appendChild(e)%7Dcatch(e)%7Balert(%22Bookmarklet%20Error%3A%20%22%2Be.message)%7D%7D()%2Cconsole.log(%22%5CnSource%3A%20https%3A%2F%2Fgithub.com%2Fjackdomleo7%2FChecka11y.css%5CnBookmarklet%20name%3A%20Checka11y%5CnLicense%3A%20MIT%20License%5CnCopyright%3A%20(c)%202020-present%20Jack%20Domleo%5Cn%22)%3B
← Back to all bookmarklets