A11y, the accessibility Grok Bot
Accessibility Grok Bot template. Audits a page and returns the corrected code: contrast, focus, labels, keyboard order and screen reader names. Ranked by who is blocked, not by rule number.
About this design Grok Bot template
A11y is the accessibility Grok Bot that returns corrected code rather than a report full of rule numbers. It ranks by who is blocked: completely blocked first, then blocked in practice, then degraded, then wrong but harmless.
Blocked completely means a control that cannot be reached by keyboard, a field with no accessible name, a modal that does not trap focus, an action available only on hover. Blocked in practice means text under 4.5 to 1, a focus outline removed and not replaced, an error announced only by colour. Contrast findings come with real computed ratios and the threshold each fails, and when it proposes a new colour it keeps the hue and moves the lightness so the design intention survives. It tabs through the page and reports the order it actually got, and it prefers native elements over aria, because a button beats a div with a role and three handlers every time.
Use A11y before an audit, before a public sector contract, and any time a keyboard user cannot finish something. Bloom is the Grok Bot for fixing contrast at the token level so the same failures stop recurring, and Lens for the same screen judged on craft rather than compliance. A11y returns corrected code rather than rule numbers, so the output is a pull request instead of a document somebody has to interpret.
Mentioned above: Bloom Design System Bot, Lens UI Review Bot. Or see every Design Grok Bot.
What to ask it
- Audit this page and give me the fixed markup.
- Which colour pairs fail, with the real ratios?
- Tab through this and tell me the order you actually got.
- This modal does not trap focus. Fix it.
- Replace these divs with the native elements they should be.
How to install this Grok Bot template
- Copy the template. You get the name, the description and the instructions.
- In Grok Bot, choose New, then Create new agent.
- Open Bot actions, then Edit Profile, and paste the name and the description.
- Paste the instructions.
- Switch on Web browsing. It needs no routines.
Or skip all five: add A11y Fix Bot to Grok Bot in one click, using Grok Bot's own share as template link.
Questions about this Grok Bot
Does this accessibility Grok Bot fix things or just report them?
It returns corrected code, in rank order, with one line each on who was blocked and what changed. It will not quote a rule number without a fix beside it.
How does it handle contrast?
With real computed ratios for both colours and the threshold each pair fails, then a new value that keeps your hue and moves the lightness.
Will it restore ugly browser focus outlines?
No. Where a focus style has been removed it adds one that fits the design, because the fix has to be one you will keep.
What can it not check?
It says so explicitly: anything that needs a real screen reader on a real device is listed rather than assumed.
Design templates for your tool
A11y Fix Bot works alongside the vibe coding tool you already build in, and the same licence covers the design templates for it: Lovable templates, Bolt templates, Replit templates, Claude Code templates, ChatGPT Codex templates, Cursor templates, Windsurf templates, Framer templates, v0 templates and Cline templates.
Included in the BrowserMoon licence, alongside every design template and all 51 Grok Bot templates. One licence, unlimited projects, including work you sell.
More Design Grok Bot templates
View allMon, the design Grok Bot
Design and build any screen
Bloom, the design system Grok Bot
Builds or audits your design tokens
Lens, the UI review Grok Bot
Reviews a screen like a senior designer
North, the brand Grok Bot
Name, voice, wordmark and palette
Browse Grok Bot templates