# tufte-data-viz > Makes your agent's charts follow Edward Tufte: high data-ink, direct labels, no chartjunk, plus accessible, responsive and dark-mode rules. tufte-data-viz is Caylent's Agent Skill for charts. Whenever your agent creates, reviews or styles a chart, graph, dashboard or sparkline, it applies Edward Tufte's data visualization principles and modern screen-first standards, so the chart comes out clean, honest and readable without extra prompting. Caylent calls it opinionated by design: it removes gridlines, swaps legends for direct labels, rejects pie charts and prefers serif type. What it teaches your agent - Start from the message: the key finding, its comparison context and the chart type that fits the data - Maximize the data-ink ratio: drop gridlines, borders, decoration and legends that don't carry data - Use direct labels and range-frame axes, with no 3D, no dual y-axes and no pie charts unless you insist - Keep gray as the main color and highlight selectively, on off-white backgrounds with serif type - Annotate what matters, write titles that state the finding, and format numbers for people ($1.2M) - Follow screen-first rules: progressive disclosure, WCAG contrast and dual encoding, responsive layouts, purposeful animation that respects reduced motion, and a dark mode designed rather than inverted - Reach for small multiples, sparklines, slopegraphs and well-ruled tables, or a sentence when a chart isn't needed - Check every chart against its validation checklist before showing it Libraries it covers - Recharts, ECharts, Chart.js, matplotlib, Plotly, and D3.js, SVG and HTML, each with its own rule file and examples Good to know - Add it with npx skills add caylent/tufte-data-viz. It's an Agent Skill that only reads its own rule files. - Every rule is a default: tell your agent when you want something different and it deviates. - It covers charts, not slide design. - Based on Tufte's four books. Made by Caylent, not by Edward Tufte. MIT licensed. - Type: Skill - Made by: caylent - Category: Data & analytics - Formats: Skills - Version: 367b6ff - Website: https://caylent.github.io/tufte-data-viz/ - Source: https://github.com/caylent/tufte-data-viz - Page: https://pluginboard.ai/skills/tufte-data-viz ## Works with - ChatGPT - Claude - Gemini - GitHub Copilot - Cursor - Claude Code - Codex - Antigravity - Gemini CLI - Replit - OpenClaw - OpenCode - Hermes Agent ## Install ### ChatGPT In ChatGPT: Download the tufte-data-viz folder and zip it, then Plugins → Skills → Create → Upload from your computer. Business and Enterprise plans. View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### Claude In Claude (web or desktop): Download the tufte-data-viz folder and zip the folder itself, then upload it in Customize → Skills. View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### Gemini In Gemini: Download the tufte-data-viz folder, then at gemini.google.com click Customize → Skills → Create → Upload and pick the folder (or a .zip of it). View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### GitHub Copilot Run in your terminal: ```shell npx -y degit caylent/tufte-data-viz ~/.copilot/skills/tufte-data-viz ``` View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### Cursor Run in your terminal: ```shell npx -y degit caylent/tufte-data-viz ~/.cursor/skills/tufte-data-viz ``` View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### Claude Code Run in your terminal: ```shell npx -y degit caylent/tufte-data-viz ~/.claude/skills/tufte-data-viz ``` View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### Codex Run in your terminal: ```shell npx -y degit caylent/tufte-data-viz ~/.agents/skills/tufte-data-viz ``` View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### Antigravity In Antigravity: Copy the tufte-data-viz folder into ~/.gemini/config/skills (Antigravity app and IDE) or ~/.gemini/antigravity-cli/skills (Antigravity CLI). View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### Gemini CLI Run in your terminal: ```shell npx -y degit caylent/tufte-data-viz ~/.gemini/skills/tufte-data-viz ``` View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### Replit Run in your terminal: ```shell npx -y degit caylent/tufte-data-viz .agents/skills/tufte-data-viz ``` View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### OpenClaw Run in your terminal: ```shell npx -y degit caylent/tufte-data-viz ~/.openclaw/skills/tufte-data-viz ``` View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### OpenCode Run in your terminal: ```shell npx -y degit caylent/tufte-data-viz ~/.config/opencode/skills/tufte-data-viz ``` View the folder on GitHub: https://github.com/caylent/tufte-data-viz ### Hermes Agent Run in your terminal: ```shell npx -y degit caylent/tufte-data-viz ~/.hermes/skills/tufte-data-viz ``` View the folder on GitHub: https://github.com/caylent/tufte-data-viz --- From Pluginboard (https://pluginboard.ai).