Skip to content

Guide · Agent skill

How to use the Data Visualization Report agent skill

Updated · written with AI from the project's own documentation and checked against our catalogue data

The Data Visualization Report skill (data-report) lets an AI agent turn a CSV, Excel or JSON file into a single web page laid out like a polished weekly or monthly report. It is aimed at analysts, managers and non-designers who want a shareable HTML summary without building a dashboard by hand. After this guide you will know what the skill does, how to install it, how to ask for a report in plain language, and where its limits are.

Data Visualization Reportnexu-io/open-design · Apache-2.0

Quick start

  1. 1Download the ZIP. Get the data-report skill ZIP from this page and unzip it.
  2. 2Place the skill folder. Put it in ~/.claude/skills/ for personal use, or in a project's .claude/skills/ folder.
  3. 3Or upload it in Claude. In the Claude apps, go to Settings → Capabilities → Skills and upload the ZIP.
  4. 4Prepare your data. Have your dataset ready as CSV, Excel or JSON, with clear column names.
  5. 5Ask for a report. Describe the data and ask for a visual report page with key metrics and charts.
  6. 6Open the generated page. Open the HTML file in a browser. Charts load from a CDN, so internet access is needed.
  7. 7Check the numbers. Compare the metrics, charts and table against your source data before sharing.

What is an agent skill, and what does this one make the agent do?

An agent skill is a folder containing a SKILL.md file of instructions that an AI agent reads when it recognises a relevant request. This skill tells the agent how to build a data report.

Once installed, the agent takes the data you provide and builds one web page. The page contains a title and time range, a row of key metric cards with changes and mini trend lines, at least two charts, a sample of the raw data table, and a few short emoji-led insights.

  • Header with report title, time range and a note on the data source
  • Three to five KPI cards showing values, change and a small trend line
  • At least two charts (bar, line, pie or scatter)
  • A data table excerpt with zebra striping, hover and a sticky header
  • Three to five short insights, each starting with an emoji
  • A collapsible methodology section

How do you install the data-report skill?

Download the ZIP file for the skill from this page and unzip it. The package includes example.html, open-design.json and SKILL.md. Then place the folder in one of these locations:

  • Personal skills: unzip into ~/.claude/skills/
  • Project skills: unzip into the .claude/skills/ folder of a specific project
  • Claude apps: upload the ZIP under Settings → Capabilities → Skills

How do you trigger the skill with a natural request?

You do not need a special command. Describe the data and the outcome you want, and mention a report, summary or visual overview. The agent should recognise the request and follow the skill's instructions.

Attach or paste your CSV, Excel or JSON data in the same message. Including the reporting period, such as a month or a week, helps the title and time range come out right.

  • "Turn this monthly sales CSV into a visual report page I can email to my team."
  • "Make a weekly dashboard-style HTML summary of this spreadsheet with key metrics and charts."
  • "Build a shareable report from this JSON export, with at least two charts and a data table."

What does the skill need to work?

The skill needs an agent runtime that can read SKILL.md files and write an HTML file. You also need input data in CSV, Excel or JSON form.

The generated page loads Chart.js or ECharts from a public CDN when opened in a browser, so the viewer needs internet access. The skill's example description also mentions inline Chart.js. The skill's instructions tell the agent to use real values from your data rather than invented numbers, and to fix chart container heights so charts do not grow endlessly in a browser.

What are the safety notes for scripts and network use?

According to the item's listing, this skill does not run scripts but does use the network. The page may load chart libraries from a public CDN when opened.

If your data is sensitive or confidential, especially financial data, think carefully before opening the generated page. Loading a chart library from a third-party CDN means the browser contacts that server. Check your organisation's rules before sharing such data this way.

  • Runs scripts: no
  • Uses network: yes (chart libraries from a CDN)
  • Avoid sending confidential financial data through this workflow without approval

What tips help you get a better report?

Clean the data first so columns have clear names and dates are consistent. Tell the agent which metrics matter most, because the skill favours three to five headline KPIs. Check the numbers in the output against your source before sharing the page.

  • Name the time period explicitly, for example 'January to March'
  • Say which columns are the key metrics
  • Ask for a shorter or longer table excerpt if needed
  • Review the insights, since they are written from your data and should be checked

What people use it for

  • Turning a monthly sales spreadsheet into a shareable summary page for a team meeting
  • Creating a weekly visual overview of operational metrics to email to a manager
  • Giving non-designers a dashboard-style page from a JSON export without manual layout work
  • Producing a quick visual check of a dataset before deeper analysis

Frequently asked questions

How do I install the data-report agent skill?

Download the skill ZIP from this page and unzip it into ~/.claude/skills/ for personal use, or into a project's .claude/skills/ folder. In the Claude apps you can instead upload the ZIP under Settings → Capabilities → Skills.

What do I need to run the Data Visualization Report skill?

You need an agent runtime that can read SKILL.md skill files and write an HTML file, plus input data in CSV, Excel or JSON form. The generated page also needs internet access in the browser to load Chart.js or ECharts from a CDN.

Is the Data Visualization Report skill free?

The skill is listed under the Apache-2.0 licence. This page does not state pricing for any agent runtime you use with it, so check the terms of your own agent platform.

Does the skill run scripts or send my data anywhere?

According to the listing, the skill does not run scripts but does use the network. The generated page may load chart libraries from a public CDN when opened, so avoid this workflow for sensitive or confidential financial data unless your organisation approves it.

Why are my charts growing endlessly or the page freezing?

The skill's instructions tell the agent to put each chart canvas in a div with a fixed height, because Chart.js with responsive settings can keep resizing when the parent has no explicit height. If you see this problem, ask the agent to set fixed heights for the chart containers and regenerate the page.

How does this skill compare to a production dashboard tool?

This skill produces a static page from pasted data. It does not provide live data connections, refresh schedules or access control, so use a production dashboard tool if you need those features.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Use this skill if you are an analyst, manager or non-designer who wants a clean, shareable HTML summary of a weekly or monthly dataset. Pick a different approach if you need live data, scheduled refreshes, access control, or if your data is confidential and cannot pass through a public CDN.

Download the skill