M
mermaid
Render Mermaid diagrams as SVG or ASCII art using beautiful-mermaid. Use when users need to create flowcharts, sequence diagrams, state diagrams, class diagrams, or ER diagrams. Supports both graphical SVG output and terminal-friendly ASCII/Unicode output.
Installation
Pick a client and clone the repository into its skills directory.
Installation
About this skill
Render Mermaid diagrams as SVG or ASCII art using beautiful-mermaid. Use when users need to create flowcharts, sequence diagrams, state diagrams, class diagrams, or ER diagrams. Supports both graphical SVG output and terminal-friendly ASCII/Unicode output.
How to use
- Przygotuj plik z kodem Mermaid (np. diagram.mmd) zawierający składnię diagramu, na przykład graph TD; Start-->End dla flowchart'u lub sequenceDiagram dla diagramu sekwencji. 2. Aby wygenerować diagram w formacie SVG (domyślny), uruchom polecenie npx tsx scripts/render.ts diagram.mmd --output diagram.svg – plik SVG pojawi się w katalogu wyjściowym. 3. Jeśli chcesz wyświetlić diagram jako tekst ASCII w terminalu, użyj flagi --ascii: npx tsx scripts/render.ts diagram.mmd --ascii. 4. Możesz również przesłać kod diagramu bezpośrednio przez stdin, na przykład echo "graph LR; A-->B-->C" | npx tsx scripts/render.ts --stdin --output flow.svg. 5. Do dostosowania wyglądu SVG zastosuj flagę --theme, na przykład --theme github-dark; wpisz --theme ? aby zobaczyć listę dostępnych motywów. 6. Sprawdź plik references/syntax.md w repozytorium, aby znaleźć pełną dokumentację składni dla każdego typu diagramu (flowchart, sequence, state, class, ER).