Skill
code-execution
Execute Python code locally with marketplace API access for 90%+ token savings on bulk operations. Activates when user requests…
@mhattingpeteInstall SkillDevelopment
Skill
/technical-doc-creator
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.
Install
$ npx -y skills add mhattingpete/claude-skills-marketplace --skill technical-doc-creator --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
- You can call itInvoke it directly when you want it.
- Slash command
/technical-doc-creator
Context preview
The summary Claude sees to decide when to auto-load this skill.
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.
SKILL.md
technical-doc-creator.SKILL.mdname: technical-doc-creator
description: 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.
Technical Documentation Creator
Create comprehensive HTML technical documentation with code examples and API workflows.
When to Use
- "Create API documentation for [endpoints]"
- "Generate technical docs for [system]"
- "Document API reference"
- "Create developer documentation"
Components
1. **Overview**: purpose, key features, tech stack 2. **Getting Started**: installation, setup, quick start 3. **API Reference**: endpoints with request/response examples 4. **Code Examples**: syntax-highlighted code blocks 5. **Architecture**: system diagram (SVG) 6. **Workflows**: step-by-step processes
HTML Structure
<!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>API Endpoint Pattern
<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>Code Block Pattern
<pre><code>// Installation
npm install package-name
// Usage
import { feature } from 'package-name';
const result = feature.doSomething();</code></pre>Workflow
1. Extract API endpoints, methods, parameters 2. Create overview and getting started sections 3. Document each endpoint with examples 4. Add code snippets for common operations 5. Include architecture diagram if relevant 6. Write to `[system]-docs.html`
Use semantic colors for HTTP methods: GET (green), POST (blue), DELETE (red).
Read more
name: technical-doc-creator description: 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.
Technical Documentation Creator
Create comprehensive HTML technical documentation with code examples and API workflows.
When to Use
- "Create API documentation for [endpoints]"
- "Generate technical docs for [system]"
- "Document API reference"
- "Create developer documentation"
Components
1. **Overview**: purpose, key features, tech stack 2. **Getting Started**: installation, setup, quick start 3. **API Reference**: endpoints with request/response examples 4. **Code Examples**: syntax-highlighted code blocks 5. **Architecture**: system diagram (SVG) 6. **Workflows**: step-by-step processes
HTML Structure
<!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>API Endpoint Pattern
<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>Code Block Pattern
<pre><code>// Installation
npm install package-name
// Usage
import { feature } from 'package-name';
const result = feature.doSomething();</code></pre>Workflow
1. Extract API endpoints, methods, parameters 2. Create overview and getting started sections 3. Document each endpoint with examples 4. Add code snippets for common operations 5. Include architecture diagram if relevant 6. Write to `[system]-docs.html`
Use semantic colors for HTTP methods: GET (green), POST (blue), DELETE (red).
Ships withclaude-skills-marketplace
A curated marketplace of Claude Code plugins for software engineering workflows.
Get the whole plugin
Other skills on claude-skills-marketplace.
@mhattingpeteInstall SkillSkill
code-refactor
Perform bulk code refactoring operations like renaming variables/functions across files, replacing patterns, and updating API…
@mhattingpeteInstall SkillSkill
code-transfer
Transfer code between files with line-based precision. Use when users request copying code from one location to another, moving…
@mhattingpeteInstall SkillSkill
file-operations
Analyze files and get detailed metadata including size, line counts, modification times, and content statistics. Use when users…
@mhattingpeteInstall SkillSkill
ensemble-solving
Generate multiple diverse solutions in parallel and select the best. Use for architecture decisions, code generation with…
@mhattingpeteInstall SkillSkill
feature-planning
Break down feature requests into detailed, implementable plans with clear tasks. Use when user requests a new feature,…
@mhattingpeteInstall Skill