Toolverse
All skills

mermaid-visualizer

by axtonliu

Transform text content into professional Mermaid diagrams for presentations and documentation. Use when users ask to visualize concepts, create flowcharts, or make diagrams from text. Supports process flows, system architectures, comparisons, mindmaps, and more with built-in

Installation

Pick a client and clone the repository into its skills directory.

Installation

Quick info

Author
axtonliu
Category
Frontend
Views
1

About this skill

Transform text content into professional Mermaid diagrams for presentations and documentation. Use when users ask to visualize concepts, create flowcharts, or make diagrams from text. Supports process flows, system architectures, comparisons, mindmaps, and more with built-in syntax error prevention.

How to use

  1. Zainstaluj skill mermaid-visualizer w swoim środowisku Claude/Copilot, dodając go do dostępnych narzędzi agenta.

  2. Gdy chcesz stworzyć diagram, opisz zawartość, którą chcesz wizualizować — na przykład: "Stwórz flowchart procesu zatwierdzania zamówienia" lub "Narysuj architekturę systemu z trzema modułami".

  3. Skill automatycznie przeanalizuje treść i wybierze odpowiedni typ diagramu (proces, przepływ kołowy, mapa myśli, porównanie lub architektura).

  4. Określ preferencje: układ (pionowy TB lub poziomy LR), poziom szczegółowości (prosty, standardowy, szczegółowy) i styl (minimalny, profesjonalny, kolorowy). Jeśli nie podasz, skill użyje domyślnych ustawień — układ pionowy, średnia szczegółowość, profesjonalne kolory.

  5. Skill wygeneruje kod Mermaid w bloku markdown, automatycznie obsługując typowe błędy składni (konflikty list, nazwy subgrafów, spacje), aby diagram poprawnie renderował się w Obsidian i GitHub.

  6. Skopiuj wygenerowany kod do swojego dokumentu lub narzędzia wspierającego Mermaid — diagram pojawi się natychmiast.

Related skills