Skip to main content
Tips

Mermaid diagrams in questions and feedback

8 min read ยท October 2026

Add safe Mermaid diagrams to Markdown questions, feedback, and API content.

Feedback

Feedback shown to taker after answering… (Markdown supported: **bold**, _italic_, # heading, lists, ```code```, tables…) · `A ⇔ B ⇒ C`

Mermaid

Question Markdown supports emphasis, headings, ordered and unordered lists, links, inline and fenced code, tables, and TeX-style math. For example:

```mermaid
flowchart TD
    A["Your turn: MAX"] --> B["Opponent: MIN"]
    B --> C["Score 3"]
    B --> D["Score 1"]
```
```mermaid
sequenceDiagram
    Learner->>QuizMachine: Submit answer
    QuizMachine-->>Learner: Explanation diagram
```

Turn on Markdown for a question body

Open the question in the quiz editor, enable Allow Markdown formatting, enter your Markdown source, and save the question.

Mermaid diagram source
Mermaid diagram source
Mermaid
Mermaid

Create quizzes programmatically with the QuizMachine API

A GET returns the same schema-version 3 package the create endpoint accepts, plus publication status, custom link, and share URL. Scripts can edit, publish, close, and share a quiz without opening the browser editor.

curl -X PATCH "https://dev-quizmachine.covecode.net/api/v1/quizzes/$QUIZ_ID/questions/$QUESTION_ID" \
  -H "Authorization: Bearer $TOKEN" \
  -H "If-Match: $ETAG" \
  -H "Content-Type: application/merge-patch+json" \
  --data-binary @- <<'JSON'
{"showFeedback":true,"feedbackAllowMarkdown":true,
 "feedbackText":"Correct answer and explanation.\n\n```mermaid\nflowchart TD\nA-->B\n```"}
JSON

Choose embedded or attached

Mermaid diagrams in questions and feedback Markdown gives technical and text-heavy questions clear structure without making authors write HTML. QuizMachine supports it in question bodies and text answer options.
Mermaid Start with flowchart TD, then paste Mermaid source without Markdown code fences.
Embed images directly in question feedback Use a feedback-image placeholder for a reusable or larger attachment that belongs at one exact point. Use base64 embedding for a small self-contained diagram. Both open in the click-to-expand lightbox.

Accessibility

Mermaid diagram source. This diagram could not be rendered. Showing the raw diagram source below.

Continue with Use Markdown in questions and answer options, Create quizzes programmatically with the QuizMachine API and Embed images directly in question feedback.