Which AI agents or platforms is this skill compatible with?

This skill is a platform-agnostic configuration designed for leading LLMs. It works within your existing AI agent environment by processing your code snippets, UI screenshots, and automated scan logs to generate structured audits.

How does this audit differ from just asking a standard AI to check my code for accessibility?

Unlike basic prompts, this skill uses a specialized logic layer to map raw data to specific WCAG 2.2 criteria. It eliminates "hallucinated" ARIA suggestions by prioritizing native HTML solutions and assigning severity based on actual user impact.

What specific files or data do I need to provide for an audit?

The skill requires basic artifacts such as HTML/CSS snippets, screenshots, or logs from tools like Axe or Lighthouse. For the most accurate results, providing both the code and a visual screenshot allows the skill to bridge the gap between structure and presentation.

What is included in the purchase of this skill?

You receive the full skill configuration including the specialized auditing logic, prioritized triage templates, and verification workflows. This allows you to immediately start generating developer-ready remediation plans and PR-ready code fixes.

Can this skill completely replace manual accessibility testing?

While the skill excels at identifying structural and semantic issues, it cannot accurately calculate color contrast from images alone or "hear" screen reader output. It will flag these as 'Manual Verification Needed' to ensure your compliance remains legally and technically sound.

Website Accessibility Audit Agent

Example session with this skill installed

Audit this HTML snippet for a login form against WCAG 2.2 AA: Submit. I also have a screenshot showing no focus ring.

Read your context and instructions
Compiled the website accessibility audit

I have reviewed the login form snippet and the reported focus visibility issue. The review targets WCAG 2.2 AA standards based on the provided HTML and visual evidence.

Executive Summary

The primary barriers involve missing semantics for interactive elements and lack of visual focus indicators, which prevent keyboard-only users from completing the login flow.

Prioritized Findings

ID	Issue	Location	Severity	Confidence	Impact	WCAG
A01	Non-semantic button	`.btn` div	Critical	Confirmed	Keyboard/Screen Reader block	2.1.1, 4.1.2
A02	Missing Alt Text	`img` tag	Medium	Confirmed	Context loss for SR users	1.1.1
A03	No Focus Indicator	Global/Form	High	Confirmed	Visual tracking failure	2.4.7

Detailed Remediation Notes

A01: Non-semantic button

Severity / Confidence: Critical / Confirmed
Evidence observed: <div> with onclick but no role or tab indexing.
User impact: Keyboard users cannot tab to the element; screen readers identify it as plain text.

Recommended fix: Replace the div with a native button element to inherit focusability and "button" role automatically.

Example: <button type="submit" class="btn">Submit</button>

Retest steps: Tab through the form to ensure the button receives focus. Press "Enter" to trigger the login function.

A03: Missing Focus Indicator

Severity / Confidence: High / Confirmed (from screenshot)
Evidence observed: Screenshot shows no visual change when form elements are active.
User impact: Sighted keyboard users cannot determine which element currently has input focus.

Recommended fix: Ensure CSS does not use outline: none without a visible alternative. Use :focus-visible for modern browsers.

Example: .btn:focus-visible { outline: 3px solid blue; outline-offset: 2px; }

Retest steps: Navigate the form using the Tab key and verify a high-contrast border appears around every interactive element.

Next steps

Replace div and span triggers with native <button> or <a> tags.
Add descriptive alt attributes to all informative images.
Remove CSS rules that suppress default browser focus outlines.

Connects securely to your tools. The creator never sees your data.

About this skill

Accessibility audits shouldn't rely on guesswork or generic checklists that ignore your actual code. This skill analyzes HTML snippets, screenshots, and scan logs to identify specific WCAG barriers and provide developer-ready remediation steps. It bridges the gap between raw automated data and actionable PRs by mapping evidence to user impact.

What it does

Evidence-based auditing analyzes provided HTML, screenshots, and manual test notes to find accessibility gaps.
Prioritized triage assigns severity based on user impact and task blocking, ranging from Low to Critical.
Remediation mapping provides specific code fixes for identified issues, prioritizing native HTML over complex ARIA.
Verification planning generates manual retesting steps for screen readers and keyboard navigation.
Confidence scoring labels findings as confirmed, potential, or needing manual verification to avoid false positives.

How it works

Submit artifacts such as component code, lighthouse reports, or UI screenshots for analysis.
Review the audit table which summarizes issues, severity, and specific WCAG criteria.
Implement fixes using the detailed remediation notes and stack-aware code examples provided.

Frameworks & tools

Works with any web stack including React, Vue, Angular, and Tailwind. Analyzes output from tools like Axe-core, Lighthouse, and browser DevTools.

Why this beats prompting it yourself

Generic prompts often hallucinate ARIA attributes or guess contrast ratios. This skill enforces strict evidence-based rules, distinguishing between confirmed code bugs and potential runtime issues while preventing legal-compliance hallucinations.

Use cases

Auditing a new UI component before it hits the design system.
Translating a raw automated scan report into prioritized developer tickets.
Verifying accessibility during a migration from legacy code to modern frameworks.
Preparing a remediation roadmap for a specific WCAG 2.2 AA target.

Known limitations

Cannot accurately calculate color contrast from screenshots alone. Cannot confirm dynamic runtime behavior or screen-reader output without specific manual test logs.

How to use

Skills on Agensi run inside your AI agent. Copy the prompt, paste it into your agent, and it connects to Agensi and installs this skill for you. If a payment is needed, your agent shows it to you first.

Reviews

No reviews yet

Be one of the first to try it. Every listed skill passes our trust checks below.

Security scanned

Passed our 8-point scan before listing

Fresh listing

Recently published to Agensi

Money-back guarantee

Doesn't do what its page promises? You get your money back.

Website Accessibility Audit Agent