← ClaudeAtlas

report-builderlisted

Generate beautiful, modern HTML reports for any purpose — system health, project status, analytics, weekly summaries, incident reports, or any structured data. Produces a self-contained single-file HTML with dark/light mode toggle, animated charts, responsive cards, and email-ready output.
Ava-AgentOne/KOVO · ★ 1 · Web & Frontend · score 72
Install: claude install-skill Ava-AgentOne/KOVO
# Report Builder ## Purpose Generate stunning, single-file HTML reports from any structured data. The output is self-contained (inline CSS/JS, no external dependencies except Google Fonts) and can be: - Served on the Kovo dashboard at port 8080 - Attached to emails via Gmail - Sent as a file via Telegram - Opened directly in any browser - Printed to PDF from the browser ## When to Use Trigger this skill when asked to: - Create/generate/build any kind of report - Make a dashboard or status page - Visualize metrics, KPIs, or structured data - Produce a summary report (weekly, monthly, project, incident, etc.) - Generate something to send via email as an HTML attachment - Generate a morning briefing as a visual report Report types: system health, morning briefings, storage reports, project status, weekly digests, incident reports, analytics dashboards. ## Architecture Single self-contained HTML file with: - Inline CSS using custom properties for theming - Inline SVG icons (no icon libraries) - Vanilla JS for theme toggle only - CSS animations (no JS animation libraries) - Google Fonts link (Outfit + JetBrains Mono) — gracefully degrades to system fonts if offline ## Report Skeleton Every report follows this structure — pick the components you need: Header (always) → Hero with Score Ring + Stat Cards (optional) → Sections with any mix of: Info Grid, Metric Cards, Data Tables, List Rows, Item Cards, Score Breakdown Cards, Timeline, Tag Cards, Recommendations → Footer (a