Tufte Data Viz

Use when creating, reviewing, or styling charts, graphs, dashboards, sparklines, or any data visualization. Applies to Recharts, ECharts, Chart.js, matplotlib, Plotly, seaborn, D3.js, and SVG. Enforces Tufte principles (data-ink ratio, direct labeling, range-frame axes) plus modern screen-first standards (accessibility, responsive, dark mode).

230 stars 9 forksData & Analytics

Install

skills CLI (Claude Code, Cursor, Codex and more)

npx skills add caylent/tufte-data-viz --skill tufte-data-viz

Manual install

git clone --depth 1 https://github.com/caylent/tufte-data-viz.git /tmp/tufte-data-viz
mkdir -p ~/.claude/skills
cp -r /tmp/tufte-data-viz/. ~/.claude/skills/tufte-data-viz

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# Tufte Data Visualization

Apply Edward Tufte's principles whenever generating or reviewing code that renders data visually. This skill covers chart generation, not slide/presentation design.

## Workflow

Follow these steps in order when creating any chart:

### Step 1: Identify the message

Before writing code, determine:
1. The key finding or trend the chart must make visible.
2. The comparison context — a baseline, prior period, target, or peer group. A number without context is meaningless.
3. The chart type that best fits the data structure (see Chart type guidance below).

### Step 2: Apply universal rules

Review the rules below. Every rule is a default — deviate only when the user explicitly requests otherwise.

### Step 3: Apply library-specific config

Use the Library quick reference table to find the essential overrides for the target library. For complete code examples and helper functions, read ONE rule file from `rules/` matching the library.

### Step 4: Validate

Run through the validation checklist at the bottom of this file before presenting the chart.

---

## Universal rules

Rules 1–14 cover static principles; 15–19 extend them for screens; 20–22 address content and formatting.

### 1. Remove top and right borders

No chart should have top or right axis lines, borders, or spines. The bottom and left axes are sufficient. Top and right lines are pure chartjunk.

### 2. Direct labels, not legends

Read the full skill on GitHub

Details

Skill name: tufte-data-viz
Repository: caylent/tufte-data-viz
License: MIT
Repo updated: 19 February 2026

FAQ

What does the Tufte Data Viz skill do?

How do I install the Tufte Data Viz skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add caylent/tufte-data-viz --skill tufte-data-viz. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is Tufte Data Viz popular?

It lives in caylent/tufte-data-viz, which has 230 GitHub stars and 9 forks.

Related skills

Analytics Tracking Automation

145

jtrackingai/analytics-tracking-automation

Use when you need GA4 + GTM tracking delivery from site discovery through publish, or when the right phase entry point is still unclear.

Data & Analytics41

Strategy Consulting Visualization

162

kgraph57/mckinsey-style-visualization-skill

Use when turning content into clear strategy-consulting visualizations, including board slides, reports, diagrams, quiet animated decks, or explicit dynamic and interactive decks with clickable evidence, scenario controls, what-if sliders, and deterministic presenter demos.

Data & AnalyticsIn 1 list22

Fit Ride Studio

149

op7418/guizang-sports-skill

Analyze one or more cycling, running, or hiking FIT/KML activity tracks, generate evidence-based single or aggregate reports, open the bundled local Ride Relief report page when the environment supports it, enrich results with user-confirmed public location context, and create shareable PNG or H.264 MP4 route stories on request. Use whenever a user wants to analyze, compare, visualize, or export .fit or .kml activities, including requests that mention a workout but do not yet include track files.

Data & Analytics12

Job Ok

431

GresonKwan/JobOK

Use when helping a Chinese job seeker, especially students, interns, or early-career users, prepare job applications with an agent without fabricating experience, auto-submitting applications, scraping hiring platforms, or promising offers.

Data & Analytics

Web Scraping

108

yfe404/web-scraper

This skill activates for web scraping and Actor development. It proactively discovers APIs via traffic interception, recommends optimal strategy (traffic interception/sitemap/API/DOM scraping/hybrid), and implements iteratively. For production, it guides TypeScript Actor creation via Apify CLI.

Data & Analytics22

Visualise

486

bentossell/visualise

Render inline interactive visuals — SVG diagrams, HTML widgets, charts, and explainers — directly in the conversation. Use this skill whenever the user asks to visualize, diagram, chart, illustrate, or explain something visually, or when an explanation would genuinely benefit from a spatial/interactive diagram rather than text. Also triggers for: flowcharts, architecture diagrams, data visualizations, interactive explainers, comparison layouts, UI mockups, and any request containing 'show me', 'draw', 'map out', 'visualize', or 'diagram'. Even when the user doesn't explicitly ask for a visual,

Data & Analytics26

Browse the most popular Claude skills, all data & analytics skills, or write your own with the skills generator.