·mermaid-generator
>_

mermaid-generator

vishalsachdev/claude-skills

Cette compétence génère des diagrammes de flux de travail interactifs à l'aide de la bibliothèque JavaScript Mermaid pour les placer dans une région étroite d'un manuel à l'aide d'une iframe. Utilisez cette compétence lorsque les utilisateurs demandent la création d'organigrammes, de diagrammes de processus, de visualisations de flux de travail ou d'arbres de décision pour les manuels pédagogiques. La compétence crée des packages MicroSim avec des fichiers HTML autonomes présentant des arrière-plans colorés, des polices 16 points et un rendu descendant par défaut, enregistrés dans /docs/sims/ suivant le modèle MicroSim.

2Installations·0Tendance·@vishalsachdev

Installation

$npx skills add https://github.com/vishalsachdev/claude-skills --skill mermaid-generator

SKILL.md

Generate simple minimalist but colorful interactive workflow diagrams using Mermaid.js for intelligent textbooks. Creates complete MicroSim packages with standalone HTML files, MkDocs integration, and Dublin Core metadata. Each diagram features colorful node backgrounds, 16-point fonts for optimal readability, and follows the educational MicroSim pattern.

Because this skill is part of the workflow for creation of textbooks using mkdocs, the design goal is to create simple unadorned diagrams without any complex padding, borders or decoration. This is because our focus is to educate, not entertain and show off our ability to do rounded corners and gradient shading.

If the description is incomplete or unclear, prompt the user for additional information:

Cette compétence génère des diagrammes de flux de travail interactifs à l'aide de la bibliothèque JavaScript Mermaid pour les placer dans une région étroite d'un manuel à l'aide d'une iframe. Utilisez cette compétence lorsque les utilisateurs demandent la création d'organigrammes, de diagrammes de processus, de visualisations de flux de travail ou d'arbres de décision pour les manuels pédagogiques. La compétence crée des packages MicroSim avec des fichiers HTML autonomes présentant des arrière-plans colorés, des polices 16 points et un rendu descendant par défaut, enregistrés dans /docs/sims/ suivant le modèle MicroSim. Source : vishalsachdev/claude-skills.

Voir l'original

Faits (prêts à citer)

Champs et commandes stables pour les citations IA/recherche.

Commande d'installation
npx skills add https://github.com/vishalsachdev/claude-skills --skill mermaid-generator
Catégorie
>_Productivité
Vérifié
Première apparition
2026-02-01
Mis à jour
2026-02-18

Réponses rapides

Qu'est-ce que mermaid-generator ?

Cette compétence génère des diagrammes de flux de travail interactifs à l'aide de la bibliothèque JavaScript Mermaid pour les placer dans une région étroite d'un manuel à l'aide d'une iframe. Utilisez cette compétence lorsque les utilisateurs demandent la création d'organigrammes, de diagrammes de processus, de visualisations de flux de travail ou d'arbres de décision pour les manuels pédagogiques. La compétence crée des packages MicroSim avec des fichiers HTML autonomes présentant des arrière-plans colorés, des polices 16 points et un rendu descendant par défaut, enregistrés dans /docs/sims/ suivant le modèle MicroSim. Source : vishalsachdev/claude-skills.

Comment installer mermaid-generator ?

Ouvrez votre terminal ou outil de ligne de commande (Terminal, iTerm, Windows Terminal, etc.) Copiez et exécutez cette commande : npx skills add https://github.com/vishalsachdev/claude-skills --skill mermaid-generator Une fois installé, le skill sera automatiquement configuré dans votre environnement de programmation IA et prêt à être utilisé dans Claude Code ou Cursor

Où se trouve le dépôt source ?

https://github.com/vishalsachdev/claude-skills