# Conversation QA
> Generate a structured, illustrated Q&A HTML document from the current conversation. Scans the conversation for conceptual questions the user asked and Claude's answers, then produces a self-contained HTML file with styled cards and SVG diagrams for technical/architectural topics. If a Q&A HTML file already exists in the current project directory, appends the new Q&As to it instead of creating a new file. Trigger this skill whenever the user asks to "generate Q&A", "create Q&A from conversation", "save Q&A", "document our Q&A", "turn this chat into Q&A", or anything suggesting they want the conversation's questions and answers captured as a document — even if they don't use the exact phrase "Q&A skill".
- Skill: `cyberelf/conversation-qa` (Agent Skill)
- Install (CLI): `npx skillmds@latest add cyberelf/conversation-qa`
- Raw SKILL.md: https://api.skillmd.com/api/skills/cyberelf/conversation-qa/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: cyberelf (https://skillmd.com/u/cyberelf)
- Updated: 2026-09-10
- Page: https://skillmd.com/skills/cyberelf/conversation-qa
---
# Conversation Q&A Generator
Extract Q&A pairs from the current conversation and produce (or extend) a polished, self-contained HTML document with illustrated explanations.
## Why this skill exists
Long technical conversations contain valuable knowledge that's hard to retrieve later. This skill captures it as a navigable document — ordered questions, clear answers, and diagrams that make complex concepts stick. The append behavior means you can keep adding to the same document across multiple sessions without losing previous Q&As.
---
## Step 1: Identify Q&A pairs
Scan the conversation history and extract turns where the **user asked a conceptual or clarifying question** and **Claude gave a substantive answer**. Skip:
- Pure commands ("create a file", "run this", "generate the HTML") — these are task instructions, not questions
- Meta-questions about Claude's behavior
- Short confirmations or acknowledgements
For each valid Q&A pair, note:
- The user's question (paraphrase to be clean and direct if needed)
- Claude's answer (summarize the key points — the HTML will expand them)
- Whether the topic is architectural/systems/conceptual (→ add a diagram) or factual/procedural (→ diagram optional)
---
## Step 2: Check for existing Q&A file
Before creating anything, look for an existing Q&A file to append to:
1. Run `Glob` for `**/*qa*.html` and `**/*q_and_a*.html` and `**/*qa_explainer*.html` in the current working directory.
2. If the user mentioned a specific file name or path, use that.
3. If multiple files exist, use the most recently modified one (check with `ls -t`).
4. If a file is found: **append mode** — add new Q&As after the last existing one.
5. If no file is found: **create mode** — generate a fresh file.
In append mode, read the existing file to:
- Get the current question count (so new questions are numbered correctly)
- Extract the nav links so you can add to them
- Identify where to insert the new sections (before ``)
---
## Step 3: Generate the HTML
### Create mode — full document
Use this base structure. The style is purposefully self-contained (no CDN dependencies):
```html
[Topic] — Q&A
[Topic area · Date]
[Title]
[One-line description of what this Q&A covers]
```
### Each Q&A section
Use this structure for each question-answer pair. Number them sequentially:
```html
N
[The user's question, clean and direct]
Caption explaining what the diagram shows
```
### Append mode — inserting into existing file
When appending to an existing file:
1. Read the file.
2. Find the current highest `id="qN"` to determine the next question number.
3. Add new nav links inside ``.
4. Insert new `` blocks before ``.
5. Update the `