skills.rest
raphaelVRA
raphaelVRACOMMUNITY
Explore all skills by this author →
GitHub

data-visualization

Generate accessible HTML/CSS/JS visualizations from raw data with colorblind-safe palettes.

Updated Apr 21, 2026
Search Tags:#charts#dashboard#visualization#accessible#colorblind-safe#html-css-js
One-click install
npx skills add https://github.com/raphaelVRA/company_agents --skill data-visualization-raphaelvra
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: data-visualization
Source: https://github.com/raphaelVRA/company_agents/tree/main/data-visualization
Command: npx skills add https://github.com/raphaelVRA/company_agents --skill data-visualization-raphaelvra

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams turn raw data into clear, accessible visualizations that communicate insights without confusion.

Core Features & Use Cases

  • Chart selection and guidance to match data with the most effective visualization.
  • Colorblind-safe palettes and accessible labeling to ensure readability for all users.
  • Dashboard layouts and production-ready HTML/CSS/JS templates that can be deployed on the web.

Quick Start

Generate an accessible chart or dashboard from your data and output ready-to-use HTML/CSS/JS code.

Frequently Asked Questions about data-visualization

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create accessible data visualizations from raw data?▼

To create accessible data visualizations, you convert raw data into clear charts using colorblind-safe palettes, accessible labeling, and production-ready HTML, CSS, and JS code for web delivery.

What is the best way to build a colorblind-safe chart for web deployment?▼

The best way to build a colorblind-safe chart is applying accessible color palettes and labeling to your selected chart type, then generating production-ready HTML, CSS, and JS templates for immediate web deployment.

How do I choose the right chart type for my dashboard layout?▼

Choosing the right chart type requires matching your raw data characteristics with the most effective visualization format, ensuring the dashboard layout communicates insights without confusion for all users.

Can I generate production-ready HTML, CSS, and JS code for a data dashboard?▼

Yes, you can generate production-ready HTML, CSS, and JS code for data dashboards, providing reusable templates and documentation-ready outputs that can be deployed directly on the web.

Does this approach to data visualization require specific libraries or dependencies?▼

No specific libraries or dependencies are required. The process generates standalone, production-ready HTML, CSS, and JS code, allowing you to deploy accessible dashboards without external framework constraints.

Why should I use colorblind-safe palettes for my data charts?▼

You should use colorblind-safe palettes for data charts to ensure readability for all users, preventing confusion and making your visualizations accessible to individuals with color vision deficiencies.

Related Skills

Explore More Data & Analytics Skills→
amanning3390amanning3390
13

data-analyst

Analyze CSV, JSON, Excel, and SQLite datasets to generate structured findings reports.

Community
Intermediate
densondenson

interactive-html-preview

Construct and validate interactive HTML surfaces live via Claude Preview MCP.

Community
Advanced
OpenSenseNovaOpenSenseNova
4.9k

range-reading-and-large-file-analysis

Convert large Excel files to Parquet and extract targeted data ranges.

Official
Intermediate
aimentor606aimentor606

visualization

Guide chart selection and provide Python code patterns for matplotlib, seaborn, and Plotly.

Community
Advanced