FlowAI Dashboard Skill
Produce a single-screen, multi-tab team management dashboard inspired by the FlowAI aesthetic. The output is a self-contained HTML file (no external runtime dependencies) with built-in interactions: tab switching, an animated bar chart, hover tooltips on charts, click-to-zoom panels, dark mode toggle, and CSV export of the visible team table.
Resource map
flowai-live-dashboard-template/
├── SKILL.md
├── assets/
│ └── template.html # reference seed used as the starting structure
├── references/
│ └── checklist.md # P0/P1/P2 quality gates
└── example.html # complete hand-built sample (gallery preview)
Workflow
- Read the active DESIGN.md (injected above). Map color, typography,
spacing, and component styling tokens to the CSS variables used by
assets/template.html. Do not invent new tokens. - Start from
assets/template.html; never generate the shell from blank. - Keep three tabs:
Team Members,Team Details,Activity Log. Tabs must actually switch and only one view is visible at a time. - Generate plausible, specific sample data (real-looking names, IDs, roles, departments, d…
