html-report

> **No idea how to design a PPT? Say one sentence, get a beautiful PPT-style HTML page — automatically.**
> Screenshot it, paste it into any slide deck. Zero manual layout. Zero design experience required.
---
✨ What Is It
html-report is an AI agent Skill that transforms any text content into **screenshot-ready PPT-style HTML pages**.
Compatible with Claude Code, Doubao (豆包), Cursor, Windsurf, and other major AI coding assistants. Every page is strictly locked to **1017×720px** (aligned to PPT canvas 10.59"×7.499" @96dpi). After screenshotting with Chrome or Puppeteer, the result can be pasted directly as a slide — no PowerPoint software needed.
When you:
- 🤔 **Have no idea how to lay out a PPT** → Describe the topic, get a generated page
- 📊 **Need chart visualization** → 12+ pure SVG chart types, zero dependencies
- 🎨 **Want a polished look** → 6 visual templates × 7 color schemes = 168 combinations
- ⚡ **Are short on time** → ~4 seconds per page, a 10-page report in about 1 minute
---
🚀 Quick Start
In any AI agent (Claude Code / Doubao / Cursor etc.), just say:
The AI will automatically handle: topic breakdown → template selection → color scheme → layout → content → HTML output
---
🐟 HTML → PPT One-to-One Conversion
> **After generating the HTML, send it to Doubao, Claude, or any AI — one prompt converts it to a real PPT!**
Copy the generated HTML content and send it to any AI assistant that supports file or long-text input, with this prompt:
**Workflow:**
---
🖼️ Style Showcase
The examples below demonstrate the visual styles this Skill can generate — showing how AI freely creates visual languages tailored to each topic:
---
Theme 1 · Mystery Intrusion · Hacker Terminal Style
> Best for: cybersecurity reports, threat intelligence, CTF presentations, penetration testing analysis
**Characteristics:** Pure black background + matrix green #00ff41 · Share Tech Mono monospace · Scanline animation texture · Terminal command-line style · Ambient glow overlay
---
Theme 2 · Minecraft · Pixel Block Style
> Best for: game reports, creative showcases, youth education, geek/fun presentations
**Characteristics:** Pixelated rendering style · Minecraft color palette (dirt / grass / sky) · Block borders · Pixel font simulation · In-game UI elements
---
Theme 3 · Ancient Epic · Chinese Classical Style
> Best for: sinology reports, historical analysis, cultural heritage, classical literature topics
**Characteristics:** Deep brown-black background #0a0502 · Gold primary color #d4a853 · Noto Serif SC · Ancient scroll paper texture · Ink flowing light effect
---
Theme 4 · Boss Report · Professional Business Style
> Best for: work summaries, quarterly reviews, business analysis, executive presentations
**Characteristics:** High-readability light background #f5f7fa · Deep blue professional palette #0f3460 · System font stack · KPI number cards · Professional chart mix
---
Theme 5 · Architecture Blueprint · Engineering Blueprint Style
> Best for: system design, technical proposals, microservice architecture, infrastructure planning
**Characteristics:** Deep sea blue background #0d1b2a · Blueprint grid overlay (dual-precision grid lines) · JetBrains Mono monospace · Engineering drawing annotation style · Connection lines and nodes
---
Theme 6 · New AI Product · Deep Space Tech Style