Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →Create HTML technical documentation with code blocks, API workflows, system architecture diagrams, and syntax highlighting. Use when users request technical documentation, API docs, API references, code examples, or developer documentation.
.claude/skills/mhattingpete-technical-doc-creator/SKILL.md| Test case | Without → With | Effect | Δ tokens | Δ turns |
|---|---|---|---|---|
| case-03 | ✗→✓ | ▲ Improved | 10% | 0% |
| case-01 | ✗→✓ | ▲ Improved | 10% | 0% |
| case-02 | ✗→✓ | ▲ Improved | 10% | 0% |
| case-06 | ✗→✓ | ▲ Improved | 287% | 0% |
| case-10 | ✗→✓ | ▲ Improved | 52% | 0% |
Create comprehensive HTML technical documentation with code examples and API workflows.
html<!DOCTYPE html> <html> <head> <title>[API/System] Documentation</title> <style> body { font-family: system-ui; max-width: 1000px; margin: 0 auto; } pre { background: #1e1e1e; color: #d4d4d4; padding: 15px; border-radius: 4px; overflow-x: auto; } .endpoint { background: #f7fafc; padding: 15px; margin: 10px 0; border-left: 4px solid #4299e1; } code { background: #e2e8f0; padding: 2px 6px; border-radius: 3px; } </style> </head> <body> <h1>[System] Documentation</h1> <!-- Overview, Getting Started, API Reference, Examples --> </body> </html>
html<div class="endpoint"> <h3><span style="color: #48bb78;">GET</span> /api/users/{id}</h3> <p>Retrieve user by ID</p> <h4>Request</h4> <pre><code>curl -X GET https://api.example.com/users/123</code></pre> <h4>Response</h4> <pre><code>{ "id": 123, "name": "John Doe", "email": "john@example.com" }</code></pre> </div>
html<pre><code>// Installation npm install package-name // Usage import { feature } from 'package-name'; const result = feature.doSomething();</code></pre>
[system]-docs.htmlUse semantic colors for HTTP methods: GET (green), POST (blue), DELETE (red).
Other measured skills in the registry, with their headline benchmark lift.