# Chart Designer

Design effective data visualizations and charts.

- Repository: https://github.com/claude-office-skills/skills (556 stars)
- Category: Design
- License: MIT
- Last updated: 2026-01-31
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add claude-office-skills/skills --skill chart-designer -g -a claude-code -y`
Codex: `npx skills add claude-office-skills/skills --skill chart-designer -g -a codex -y`
Cursor: `npx skills add claude-office-skills/skills --skill chart-designer -g -a cursor -y`
Gemini CLI: `npx skills add claude-office-skills/skills --skill chart-designer -g -a gemini-cli -y`

## Description

Design effective data visualizations and charts. Generate chart configurations for ECharts, Chart.js, and other libraries. Create dashboards and reports.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Chart Designer Skill

## Overview

I help you design effective data visualizations by recommending the right chart types, generating configurations for popular charting libraries, and applying data visualization best practices.

**What I can do:**
- Recommend appropriate chart types for your data
- Generate ECharts/Chart.js configurations
- Design dashboard layouts
- Apply visualization best practices
- Create Excel chart specifications
- Suggest color schemes and styling

**What I cannot do:**
- Render charts directly (use generated configs in tools)
- Create custom chart types from scratch
- Access your data directly

---

## How to Use Me

### Step 1: Describe Your Data

Tell me:
- What type of data you have
- What story you want to tell
- Your audience (technical, executive, public)
- Where it will be displayed (presentation, dashboard, report)

### Step 2: Get Recommendations

I'll suggest:
- Best chart type(s) for your data
- Configuration options
- Color schemes
- Layout considerations

### Step 3: Receive Chart Configs

I'll provide:
- ECharts JSON configuration
- Chart.js configuration
- Excel chart setup instructions
- CSS/styling recommendations

---

## Chart Selection Guide

### Comparison Charts
| Chart Type | Best For | Data Requirements |
|------------|----------|-------------------|
| Bar Chart | Comparing categories | Categories + values |
| Grouped Bar | Multiple series comparison | Categories + multiple series |
| Stacked Bar | Part-to-whole comparison | Categories + component values |

### Trend Charts
| Chart Type | Best For | Data Requirements |
|------------|----------|-------------------|
| Line Chart | Change over time | Time series data |
| Area Chart | Cumulative trends | Time series (stacked optional) |
| Sparkline | Compact trends | Simple time series |

The rest: https://github.com/claude-office-skills/skills/blob/HEAD/chart-designer/SKILL.md