Éditeur de diagrammes Mermaid
Écrivez la syntaxe Mermaid à gauche et regardez votre organigramme, diagramme de séquence ou de Gantt se rendre en direct à droite.
Tout ce qu'il faut pour créer des diagrammes en tant que code
Aperçu en direct instantané
Regardez votre diagramme se rendre dès que vous tapez — aucune étape de compilation, aucun bouton à presser, aucune attente.
Tous les types de diagrammes Mermaid
Organigrammes, diagrammes de séquence, diagrammes de classes, diagrammes d'état, diagrammes de Gantt, cartes mentales et plus — toute la syntaxe Mermaid 11.
Sélecteur de thème
Basculez entre les thèmes défaut, neutre et sombre pour correspondre à vos docs, diapositives ou tableaux de bord sans changer une ligne de code.
Export SVG et PNG
Téléchargez un SVG vectoriel net ou un PNG haute résolution, ou copiez le balisage SVG directement dans votre presse-papiers.
Privé, rien n'est téléversé
Tout le rendu s'effectue localement dans votre navigateur — votre diagramme ne quitte jamais votre appareil, sans limite de taille ni compte.
Erreurs de syntaxe claires
Les diagrammes invalides sont détectés instantanément et affichés avec une erreur lisible, pour corriger la syntaxe rapidement.
À propos de l'éditeur de diagrammes Mermaid
L'éditeur de diagrammes Mermaid est un outil gratuit dans le navigateur pour écrire et prévisualiser des diagrammes Mermaid. Saisissez la syntaxe Mermaid à gauche et voyez le diagramme rendu se mettre à jour en direct à droite, avec trois thèmes intégrés — défaut, neutre et sombre. Une fois votre diagramme à votre goût, copiez le code ou le SVG, ou téléchargez-le en SVG vectoriel ou PNG haute résolution. Comme tout s'exécute localement avec la bibliothèque open-source Mermaid, il n'y a ni téléversement, ni limite de taille, ni compte requis.
Comment créer un diagramme Mermaid
Trois étapes pour passer d'une idée à un diagramme partageable.
Écrivez votre diagramme sous forme de texte
Commencez par l'exemple intégré ou saisissez directement la syntaxe Mermaid — organigrammes, diagrammes de séquence, diagrammes de classes et plus.
Regardez-le se rendre en direct
Le diagramme se met à jour automatiquement pendant que vous éditez. Basculez de thème avec la liste déroulante pour trouver l'aspect souhaité.
Exportez ou partagez
Copiez le code Mermaid ou le SVG, ou téléchargez le diagramme en fichier SVG ou PNG pour vos docs, diapositives et README.
Bon à savoir
Les diagrammes sont rendus avec Mermaid 11 en mode de sécurité strict, qui assainit les libellés pour qu'aucun HTML ou script ne s'exécute — les gestionnaires de clic interactifs sont désactivés dans l'aperçu. Les PNG exportés sont rendus en résolution 2x pour des impressions nettes, et tout s'exécute localement, il n'y a donc aucune limite de taille de fichier.