Builds dashboards, reports, and data-driven interfaces requiring charts, graphs, or visual analytics. Provides systematic framework for selecting appropriate visualizations based on data characteristics and analytical purpose. Includes 24+ visualization types organized by purpose (trends, comparisons, distributions, relationships, flows, hierarchies, geospatial), accessibility patterns (WCAG 2.1 AA compliance), colorblind-safe palettes, and performance optimization strategies.
SkillScore100Maintained
Automatic
◆Data Analyst pack
Last verified 8/21/2026
What it changes
Passed 23 of 23 test cases with the skill, and 19 of 23 without it.
Without skill83%
With skill100%
Checks it passed that the model alone missed
Recommends adding a descriptive aria-label attribute.
Recommends a Sankey diagram for directional user flow volumes.
Recommends Enter or Space keys for triggering data point tooltips.
and 1 more in the full report
4 fixed19 passed either way0 still failing0 broke
Pass-rate lift
+17 pp
Tokens
+124%
Agent turns
0%
Response time
+3%
Model gemini-3.6-flashMeasured 8/21/2026v123 of 23 cases passed with skill
Tokens, turns and time describe resource use, not a dollar price.
See it in action
One of 4 test cases the skill fixed. Same model, same prompt, with and without the skill.
1 of 4
Prompt
An e-commerce checkout analysis wants to trace customer navigation steps from landing page to cart to checkout to purchase, showing exact drop-off numbers transitioning between stages. Which visualization choice fits this requirement?
What was checked, without and with the skill
Checked
Without skill
With skill
Recommends a Sankey diagram for directional user flow volumes.
Missed
Passed
case-11 · gemini-3.6-flash · 8/21/2026 · answers are capped and redacted
What's inside
The instructions your model reads when the skill loads.
SKILL.md324 lines9 filesincludes scripts
Data Visualization Component Library
Systematic guidance for selecting and implementing effective data visualizations, matching data characteristics with appropriate visualization types, ensuring clarity, accessibility, and impact.
Overview
Data visualization transforms raw data into visual representations that reveal patterns, trends, and insights. This skill provides:
Selection Framework: Systematic decision trees from data type + purpose → chart type
24+ Visualization Methods: Organized by analytical purpose
Accessibility Patterns: WCAG 2.1 AA compliance, colorblind-safe palettes
Performance Strategies: Optimize for dataset size (<1000 to >100K points)
Multi-Language Support: JavaScript/TypeScript (primary), Python, Rust, Go
Quick Start Workflow
Step 1: Assess Data
What type? [categorical | continuous | temporal | spatial | hierarchical]
How many dimensions? [1D | 2D | multivariate]
How many points? [<100 | 100-1K | 1K-10K | >10K]
Step 2: Determine Purpose
What story to tell? [comparison | trend | distribution | relationship | composition | flow | hierarchy | geographic]
Step 3: Select Chart Type
Quick Selection:
Compare 5-10 categories → Bar Chart
Show sales over 12 months → Line Chart
Display distribution of ages → Histogram or Violin Plot
Explore correlation → Scatter Plot
Show budget breakdown → Treemap or Stacked Bar
Complete decision trees: See references/selection-matrix.md