dataviz
Use this skill whenever you are about to create ANY chart, graph, plot, dashboard, or data visualization, in ANY output medium (HTML/React artifact, inline SVG, matplotlib/plotly/d3/Recharts, PNG). Read it BEFORE writing the first line of chart code, choosing chart colors, building a stat tile / KPI row, or laying out a dashboard. Teaches a design-system-agnostic method - form heuristic, color formula with a runnable validator, mark specs, interaction rules. Default palette in references/palette.md.
- License
- Anthropic's dataviz skill: not MIT-licensed, rights stay with Anthropic. Complete terms in NOTICE.md: https://github.com/JimLiu/baoyu-design/blob/main/NOTICE.md
Pinned to revision 8ec4b3d2c0d6, so it is the text this page describes rather than whatever the author pushed since.
Files
- skills/dataviz/SKILL.md
- skills/dataviz/references/anti-patterns.md
- skills/dataviz/references/choosing-a-form.md
- skills/dataviz/references/color-formula.md
- skills/dataviz/references/components.md
- skills/dataviz/references/interaction.md
- skills/dataviz/references/marks-and-anatomy.md
- skills/dataviz/references/palette.md
- skills/dataviz/scripts/validate_palette.js
- skills/dataviz/scripts/validate_palette.py
Every link opens the file at its source, pinned to the revision this page describes.