Guide · Agent skill
How to use the Live Team Dashboard agent skill
Updated · written with AI from the project's own documentation and checked against our catalogue data
The Live Team Dashboard skill (skill name live-dashboard) teaches an AI agent to build a single-page team status dashboard in a Notion-like visual style, as one HTML page. It is aimed at teams that want a visual mockup of a status page, designers prototyping an internal operations dashboard, and developers who need an HTML starting point. After this guide you will know what the skill produces, how to install it, how to ask for a dashboard in plain language, and where its limits are.
Live Team Dashboardnexu-io/html-anything · Apache-2.0 Download the skill Quick start
- 1Download the ZIP. Download the live-dashboard ZIP from the skill's page on this site.
- 2Choose where to install. Pick personal (~/.claude/skills/), project (.claude/skills/ in your project) or the Claude apps.
- 3Unzip or upload. Unzip the file into the chosen folder, or upload the ZIP under Settings → Capabilities → Skills in the Claude apps.
- 4Confirm the files. Check that SKILL.md and example.html are present in the skill folder.
- 5Ask in plain language. Request a team status dashboard, naming the team, time window and content you want.
- 6Replace seed data. Review the output and swap any sample numbers for real figures before sharing.
What is an agent skill and what does this one do?
An agent skill is a folder of instructions that an AI agent loads when a request matches what the skill is for. The live-dashboard skill is built around a single file, SKILL.md, which describes the layout and visual style the agent should follow. A companion example.html file shows the look of the result.
When the skill is active, the agent produces a one-page team status dashboard with this layout: a header with the team name and time window, a grid of key metric cards, small 7-day sparkline trend lines, a live-looking activity feed with avatars, actions and timestamps, and a striped task table with colored status pills. The styling follows Notion-style callouts, toggles and database tables.
Install the skill (ZIP download or Claude apps)
You can add the skill in one of three ways. Download the ZIP from the skill's page on this site, then pick the option that fits your setup.
Option 1 is a personal install. Unzip the download into ~/.claude/skills/ so the skill is available across your projects. Option 2 is a project install. Unzip it into the .claude/skills/ folder inside a specific project, so only that project uses it. Option 3 is the Claude apps: open Settings, go to Capabilities, then Skills, and upload the ZIP there.
- Personal: unzip into ~/.claude/skills/
- Project: unzip into .claude/skills/ inside your project folder
- Claude apps: Settings → Capabilities → Skills → upload the ZIP
Check the files after install
The skill package contains two files: SKILL.md, which holds the instructions the agent reads, and example.html, which is a sample of the finished page. After unzipping, the skill folder should contain both files. If you use the file-based install, confirm that SKILL.md sits directly inside the skill folder so the agent can find it.
The skill needs nothing else to run. It lists no requirements, runs no scripts and does not use the network.
How to trigger the skill with natural requests
You do not need a special command. Describe what you want in plain words that match the skill's purpose: a team status page, an operations overview, or a visual dashboard mockup. Naming the team and the time window you care about helps the header come out right.
Good requests name the output and the content, for example: a Notion-style team status page with KPI cards and a 7-day trend, or an operations dashboard for a five-person design team this week. If you already have numbers, paste them into the request so the agent does not fall back to sample data.
- Make a Notion-style team status dashboard for the platform team.
- Build a one-page operations dashboard with KPI cards, 7-day sparklines and a task table.
- Mock up a live activity feed and task board for our design team's weekly review.
What to expect and how to use the output
The skill is designed to produce a complete-looking page even when no real data is provided. It fills the layout with built-in seed data so the header, cards, charts, feed and table all appear. This is useful for layout review and visual approval.
Treat seed values as placeholders. The skill describes layout and style only. It does not connect to a database or live data source, so the page will not update on its own. Developers can use the HTML as a starting point and wire in their own data later.
- Good for: visual mockups, design prototypes, and an HTML base to connect to real data later
- Not good for: production reporting with real figures, since seed numbers can be mistaken for actual results
- Not good for: live-updating dashboards backed by a database
Safety notes: scripts and network access
The skill runs no scripts and uses no network access, according to its listing. It works by instructing the agent how to write the page. Nothing in the package is described as calling external services.
Still, check any generated page before sharing it. Because the activity feed, metrics and tasks may be sample content, make sure no seed figure is presented as a real team result.
- No scripts are run by the skill
- No network use is listed
- Review generated numbers and names before sharing externally
What people use it for
- A manager mocking up a weekly team status page for stakeholder feedback before data is connected.
- A designer prototyping the visual style of an internal operations dashboard in a Notion-like look.
- A developer generating an HTML starting point that will later be wired to a real data source.
- A team lead previewing how KPI cards, sparklines and a task table would look for a standup review.
Frequently asked questions
Is the Live Team Dashboard skill free?
The skill is published under the Apache-2.0 licence, as listed on its page. Check the licence file in the source repository for the full terms before using it in a commercial product.
What do I need to run the live-dashboard skill?
The skill lists no requirements, runs no scripts and uses no network access. You need an agent environment that supports skills, such as the Claude apps or Claude Code with a skills folder.
Where do I put the skill files?
Unzip the downloaded ZIP into ~/.claude/skills/ for a personal install, or into .claude/skills/ inside a project for a project-only install. In the Claude apps, upload the ZIP under Settings → Capabilities → Skills.
Will the dashboard show my real team data?
Not automatically. The skill only describes layout and style. If no real data is given, it fills the page with built-in seed data, so you need to paste your figures into the request or edit the HTML yourself.
Can it build a live-updating dashboard connected to a database?
No. The skill does not define any data connection, so the page does not update from a database. It is best used as a visual starting point that developers connect to a data source themselves.
How does it compare with other dashboard tools?
This skill focuses on producing a single HTML page in a Notion-style design from an agent request. Tools built for live reporting, such as BI dashboards connected to databases, are a better fit when figures must be real and update automatically.
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 need a quick, good-looking team status mockup, a design prototype, or an HTML starting point for a developer to wire up later. Pick a different tool if you need production reporting with real figures or a dashboard that updates live from a database, since this skill only handles layout and style and falls back to sample data.
Download the skill