Skip to content
Get packs

Live Team Dashboard

Builds a Notion-style team dashboard with KPIs, 7-day trends, an activity feed and a task table

Source Download skill
Repository
nexu-io/html-anything
Stars
9,376
Licence
Apache-2.0
Files
2 files

What it does

This skill tells an AI agent how to produce a single-page team status dashboard in a Notion-like visual style. It lays out a header with team name and time window, a grid of key metric cards, small 7-day trend lines, a live-looking activity feed with avatars, and a striped task table with colored status labels. If no real data is available, it fills the page with built-in sample data so the layout still looks complete.

Great for

  • Teams that want a quick visual mockup of a team status page before connecting real data
  • Designers prototyping an internal operations dashboard
  • Developers who need an HTML starting point they can later wire to a data source

Skip it if

  • Production reporting that must show real figures: the skill falls back to seed data, which can be mistaken for actual numbers
  • Anyone needing a live-updating dashboard backed by a database: the skill only describes layout and style, not data connections

Try asking

  • “Make a Notion-style team dashboard for our weekly operations review”
  • “Create a desktop dashboard page with KPI cards, a 7-day trend and a task table”
  • “Build a team activity feed mockup with avatars and status pills”
Step-by-step guide: how to use Live Team DashboardInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 2 original files, the Apache-2.0 licence and an attribution note.

    live-dashboard.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip live-dashboard.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip live-dashboard.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Give the agent your real metrics and team names so the seed sample data is replaced with accurate content.
  • Label any output using sample data clearly before sharing it with stakeholders.
  • Ask for a specific time window (for example, the last 7 days) to match your reporting period.

What's inside

  • example.html
  • SKILL.md

Redistributed unmodified from nexu-io/html-anything under the Apache-2.0 licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.