Éditeur de diagrammes Mermaid
Prévisualisez des diagrammes assainis et exportez en SVG ou PNG.
Comment utiliser Éditeur de diagrammes Mermaid
The Mermaid diagram editor renders Mermaid text, such as a flowchart LR definition, into a diagram preview and lets you download it as SVG or PNG. Rendering runs in Mermaid's strict security mode, and the SVG is sanitized to remove scripts and embedded HTML. Diagrams can be up to 20,000 characters and 300 lines.
- Collez la source dans l'éditeur de saisie ou chargez l'exemple intégré.
- Définissez le format de téléchargement.
- Lancez l'éditeur de diagrammes Mermaid, vérifiez le résultat, puis utilisez les commandes de copie ou de téléchargement disponibles.
Ce que cet outil prend en charge
Prévisualisez des diagrammes assainis et exportez en SVG ou PNG.
- Format de téléchargement
- SVG · PNG
Limites et traitement
Les images utilisent la limite existante de 32 mégapixels du canevas. Jusqu'à 100 images sources sont autorisées lorsque c'est pris en charge. Le HTML collé est limité à 200 000 caractères ; les diagrammes Mermaid à 20 000 caractères et 300 lignes. La génération SVG et PNG nécessite un navigateur.
Exemple de source
flowchart LR A[Choose a tool] --> B[Add your input] B --> C[Review the result]
Questions fréquentes
How do I export a Mermaid diagram as PNG?
Paste your Mermaid code, set Download format to PNG and run the editor. The sanitized SVG is drawn onto a canvas and saved as diagram.png, capped at 8,000 pixels per side. Choose SVG instead for a scalable vector file.
Why is my Mermaid init directive or front matter rejected?
Configuration directives such as %%{init: ...}%% and front matter blocks starting with --- are disabled for safety, and the editor returns an error if they appear. Themes and other settings in those blocks are not applied, so remove them before rendering.
Why do HTML labels not appear in my diagram?
Diagrams render with Mermaid's strict security level and flowchart HTML labels turned off, and the output is sanitized to strip script and foreignObject elements. Use plain-text labels inside node brackets, such as A[Choose a tool], instead of HTML markup.
Où ma saisie est-elle traitée ?
Cette opération traite sa source dans votre navigateur. La copie et le téléchargement sont des actions explicites ; la saisie source n'est enregistrée ni dans un compte ni dans l'historique.
Quelles sont les limites de saisie ?
Les images utilisent la limite existante de 32 mégapixels du canevas. Jusqu'à 100 images sources sont autorisées lorsque c'est pris en charge. Le HTML collé est limité à 200 000 caractères ; les diagrammes Mermaid à 20 000 caractères et 300 lignes. La génération SVG et PNG nécessite un navigateur.