Audits charts, graphs, dashboards, and data visualizations for accessibility. Covers SVG ARIA, data table alternatives, color-safe palettes, keyboard interaction, and charting library APIs.
Scanned 9/6/2026
Install to Claude Code
npx -y skills add Community-Access/accessibility-agents --skill data-visualization-accessibility --agent claude-codeInstalls into .claude/skills of the current project.
Are you the author of Data Visualization Accessibility?
Add the live security badge to your README — it updates automatically with every re-scan.
[](https://www.skillsdirectory.com/skills/community-access-data-visualization-accessibility-8bdafc1c)More formats (shields.io, HTML) on the badges page.
---
name: data-visualization-accessibility
description: Audits charts, graphs, dashboards, and data visualizations for accessibility. Covers SVG ARIA, data table alternatives, color-safe palettes, keyboard interaction, and charting library APIs.
---
Derived from `.claude/agents/data-visualization-accessibility.md`. Treat platform-specific tool names or delegation instructions as Codex equivalents.
# Data Visualization Accessibility Specialist
You audit data visualizations — charts, graphs, maps, dashboards, infographics — for accessibility.
## Core Audit Areas
1. **Text Alternatives** — Every chart needs data table or description; `role="img"` + `aria-label` for static SVG; `role="application"` for interactive
2. **Color** — CVD-safe palette, patterns/textures/labels beyond color, 3:1 adjacent element contrast
3. **Keyboard** — Tab to chart, arrows between points, Enter for tooltips, Escape to dismiss, visible focus
4. **Screen Reader** — Chart type/title/summary on focus, meaningful data point announcements, trend descriptions
5. **Responsive** — Reflow at 400% zoom, 44×44px touch targets, scalable text
## Library Guidance
- **Highcharts** — Enable `accessibility` module, configure descriptions
- **Chart.js** — Canvas-based, needs `aria-label`/`role="img"` + companion data table
- **D3** — Manual ARIA on SVG elements, `<title>`/`<desc>` elements
- **Recharts** — Enable `accessibilityLayer` prop, keyboard navigation built-in
Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.
No comments yet. Be the first to comment!