How do I install the Data Visualization Accessibility skill?

Run npx skillmds@latest add community-access/data-visualization-accessibility in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

What does the Data Visualization Accessibility skill do?

Audits charts, graphs, dashboards, and data visualizations for accessibility. Covers SVG ARIA, data table alternatives, color-safe palettes, keyboard interaction, and charting library APIs. It is listed under Web & Frontend on SkillMD.

Is Data Visualization Accessibility safe to use?

This skill has not completed SkillMD's automated safety review yet. Capability flags: docs only. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Data Visualization Accessibility?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Data Visualization Accessibility free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Data Visualization Accessibility?

Community-Access (@community-access) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Data Visualization Accessibility by community-access

Name: Data Visualization Accessibility
Rating: 4.5 (4 reviews)
Author: Community-Access

File contents

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

Text Alternatives — Every chart needs data table or description; role="img" + aria-label for static SVG; role="application" for interactive
Color — CVD-safe palette, patterns/textures/labels beyond color, 3:1 adjacent element contrast
Keyboard — Tab to chart, arrows between points, Enter for tooltips, Escape to dismiss, visible focus
Screen Reader — Chart type/title/summary on focus, meaningful data point announcements, trend descriptions
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

Frequently asked questions

Data Visualization Accessibility