SciFig
Démarrer gratuitement

Convertisseur Mermaid en PNG et SVG gratuit

Collez votre code Mermaid, affichez le diagramme dans votre navigateur et téléchargez-le en PNG ou SVG. Les libellés, flèches et groupes restent réunis dans une image que vos collègues peuvent ouvrir sans éditeur de code.

Décrivez ce que vous voulez dans le champ ci-dessus.

Commencez avec jusqu'à 150 crédits gratuits|Aucune carte de crédit requise

Avec une invitation, obtenez jusqu'à 350 crédits gratuits dès le premier jour.

3 moteurs de figures · plus de 500 modèlesChaque étiquette modifiable · plus de 60 jeux de couleursPPTX modifiable · SVG en couches · 8K PNG / JPG

Convertisseur Mermaid en PNG et SVG gratuit— modèles et exemples

Mis à jour

Diagramme mermaid

Convertisseur Mermaid en PNG et SVG gratuit

Transformez votre code en image nette, avec le fond et l’échelle d’export de votre choix.

La conversion Mermaid en PNG transforme un diagramme écrit en code en image pour vos documents et présentations. Collez votre code Mermaid, affichez le diagramme dans votre navigateur et téléchargez-le en PNG ou SVG. Les libellés, flèches et groupes restent réunis dans une image que vos collègues peuvent ouvrir sans éditeur de code.

Créer le diagramme Mermaid
Organigramme Mermaid reliant question de recherche, expérience, analyse et figure scientifique
  • Coller le code du diagramme
  • Choisir l’échelle du PNG
  • Exporter sur fond transparent
  • Télécharger le SVG

Fonctions du diagramme Mermaid

Transformez votre code en image nette, avec le fond et l’échelle d’export de votre choix.

Afficher un diagramme à partir du code

SciFig dessine les nœuds, relations et libellés définis dans votre code Mermaid. Le résultat suit votre source sans réinterprétation par une IA. Utilisez un logigramme, un diagramme de séquence ou un diagramme de classes pour illustrer votre explication.

  • Coller le code du diagramme
  • Afficher les nœuds et leurs relations
  • Conserver les sous-graphes
Afficher le code Mermaid

Exporter un PNG lisible

Choisissez une échelle d’export adaptée à votre document. Une échelle plus grande fournit davantage de pixels sans changer les proportions. L’image réunit le texte et les tracés : elle peut être insérée dans une présentation même si celle-ci ne prend pas en charge Mermaid.

  • Choisir l’échelle du PNG
  • Conserver le diagramme entier
  • Insérer l’image dans une présentation
Préparer le PNG

Choisir le fond de l’image

Un fond transparent permet de poser le diagramme sur une diapositive colorée. Un fond blanc rend l’image autonome. Choisissez le fond selon la destination du fichier ; SciFig l’applique à l’export du même diagramme que celui affiché dans l’aperçu.

  • Exporter sur fond transparent
  • Utiliser un fond blanc
  • Adapter l’image à la diapositive
Choisir le fond

Conserver aussi une version vectorielle

Téléchargez le diagramme Mermaid en SVG pour conserver un format vectoriel redimensionnable. Le PNG convient aux documents courants, tandis que le SVG préserve les lignes et le texte sous forme vectorielle. Les deux fichiers proviennent du même code et du même rendu.

  • Télécharger le SVG
  • Conserver les tracés vectoriels
  • Garder le code avec l’image
Exporter le diagramme Mermaid

Comment créer la figure

Préparez votre figure avec les commandes ci-dessous, puis téléchargez le résultat.

  1. Coller le code Mermaid

    Collez la source d’un logigramme, d’un diagramme de séquence ou de classes pris en charge. Ajoutez les libellés et relations à faire apparaître : ce sont les instructions du code qui déterminent le dessin.

  2. Afficher le diagramme

    Lancez le rendu pour afficher les nœuds, groupes et connexions. Si le rendu échoue, corrigez la syntaxe ou le type de diagramme, puis réessayez. Le rendu obtenu sert aussi aux téléchargements PNG et SVG.

  3. Choisir le fond et l’échelle

    Sélectionnez un fond blanc ou transparent et l’échelle du PNG. Un fond transparent s’intègre à une diapositive colorée. Une échelle plus grande augmente le nombre de pixels tout en conservant les proportions du diagramme.

  4. Télécharger le PNG ou le SVG

    Téléchargez le PNG pour un document ou une présentation, ou le SVG pour une version vectorielle. Conservez le code Mermaid avec les fichiers : les prochaines modifications de structure pourront repartir de cette source.

Utilisations du diagramme Mermaid

Une figure légendée relie votre explication à un support visuel pour la recherche et l’enseignement.

Organigramme Mermaid reliant question de recherche, expérience, analyse et figure scientifique

Insérer un processus dans un rapport

Convertissez le code Mermaid d’une procédure en PNG pour montrer les étapes et décisions sans imposer un éditeur au lecteur. Conservez l’image avec le rapport et relancez la conversion lorsque le processus évolue.

Explorer cet exemple
Diagramme de séquence Mermaid montrant l’ajout du code, l’aperçu et l’export PNG par un chercheur

Partager une séquence avec l’équipe

Affichez les participants et leurs échanges dans un diagramme de séquence. Exportez l’interaction complète pour une réunion : l’ordre des messages reste visible dans une présentation ou un compte rendu, sans intégration Mermaid.

Explorer cet exemple
Diagramme de classes Mermaid reliant Experiment et Figure avec leurs attributs et méthodes

Documenter des relations entre classes

Un diagramme de classes expose les relations autrement qu’une capture du code. Exportez le rendu en SVG pour une figure redimensionnable, ou en PNG pour un document acceptant les images matricielles.

Explorer cet exemple
Organigramme Mermaid reliant le code, une étape PNG transparent et l’arrière-plan d’une diapositive

Adapter le diagramme à une diapositive

Placez un PNG transparent sur le fond de votre présentation. Choisissez une échelle suffisante pour garder les libellés lisibles. Les modifications des relations se font dans le code avant de créer la nouvelle image.

Explorer cet exemple
Processus Mermaid avec un sous-graphe de préparation des échantillons, puis mesure de la réponse et comparaison des conditions

Expliquer des étapes regroupées

Les sous-graphes délimitent des groupes d’étapes dans un processus plus large. Exportez les limites et les libellés complets pour distinguer chaque groupe du déroulement général, notamment lorsque plusieurs équipes participent à une procédure.

Explorer cet exemple
Organigramme Mermaid reliant question de recherche, expérience, analyse et figure scientifique

Conserver une figure portable

Rangez le code Mermaid et ses versions PNG et SVG dans le dossier du projet. L’image se partage facilement et le code garde une trace concise des relations. SciFig FlowChart (logigrammes) permet aussi de créer un diagramme à partir d’une description.

Explorer cet exemple

Comment les chercheurs utilisent SciFig

Notre document de méthodes comportait un processus conservé dans un fichier Mermaid. J’ai converti Mermaid en PNG pour retrouver les mêmes points de décision dans le rapport, sans utiliser un autre éditeur. En gardant le code à côté de l’image exportée, notre équipe savait clairement où modifier le processus lorsque le protocole évoluait.

Lena W.

Ingénieure en logiciels de recherche, Université de Cambridge

Outils gratuits

Un outil pour chaque figure scientifique

120 générateurs spécialisés pour la figure scientifique dont vous avez besoin — chacun s’ouvre dans le bon espace de travail avec un exemple.

Illustrations, structures et schémas conceptuels

60 outils
Figure d’exemple : Générateur de structures chimiquesGénérateur de structures chimiquesFigure d’exemple : Créateur de résumé graphiqueCréateur de résumé graphiqueFigure d’exemple : Générateur de diagrammes de corps libreGénérateur de diagrammes de corps libreFigure d’exemple : Générateur de schémas de circuitGénérateur de schémas de circuitFigure d’exemple : Générateur d’images scientifiques par IAGénérateur d’images scientifiques par IAFigure d’exemple : Plaque à 96 puits modifiablePlaque à 96 puits modifiableFigure d’exemple : Générateur de structures de LewisGénérateur de structures de LewisFigure d’exemple : Générateur de schémas de l’ADNGénérateur de schémas de l’ADNFigure d’exemple : Créateur de schémas de câblageCréateur de schémas de câblageFigure d’exemple : Créateur de schémas de tuyauterie et d’instrumentationCréateur de schémas de tuyauterie et d’instrumentationFigure d’exemple : Créateur de posters scientifiquesCréateur de posters scientifiquesFigure d’exemple : Créateur de cladogrammesCréateur de cladogrammesFigure d’exemple : Créateur de réseaux alimentairesCréateur de réseaux alimentairesFigure d’exemple : Générateur d’illustrations médicalesGénérateur d’illustrations médicalesFigure d’exemple : Générateur de schémas de PCRGénérateur de schémas de PCRFigure d’exemple : Convertisseur de texte PPT en visuelsConvertisseur de texte PPT en visuelsFigure d’exemple : Générateur de schémas de la mitoseGénérateur de schémas de la mitoseFigure d’exemple : Générateur d’infographies par IAGénérateur d’infographies par IAFigure d’exemple : Générateur de dessins anatomiquesGénérateur de dessins anatomiquesFigure d’exemple : Comparaison des cellules animales et végétalesComparaison des cellules animales et végétalesFigure d’exemple : Générateur de schémas de cellule animaleGénérateur de schémas de cellule animaleFigure d’exemple : Schéma de la structure d’un anticorpsSchéma de la structure d’un anticorpsFigure d’exemple : Schéma de l’apoptoseSchéma de l’apoptoseFigure d’exemple : Générateur de schémas de bactériesGénérateur de schémas de bactériesFigure d’exemple : Créateur de plans d’architectureCréateur de plans d’architectureFigure d’exemple : Créateur de modèles de BohrCréateur de modèles de BohrFigure d’exemple : Générateur de schémas du cycle de CalvinGénérateur de schémas du cycle de CalvinFigure d’exemple : Générateur de schémas du cycle du carboneGénérateur de schémas du cycle du carboneFigure d’exemple : Générateur de schémas du cycle cellulaireGénérateur de schémas du cycle cellulaireFigure d’exemple : Générateur de schémas de la respiration cellulaireGénérateur de schémas de la respiration cellulaireFigure d’exemple : Schéma du système du complémentSchéma du système du complémentFigure d’exemple : Schéma CRISPR-Cas9Schéma CRISPR-Cas9Figure d’exemple : Générateur de schémas de réplication de l’ADNGénérateur de schémas de réplication de l’ADNFigure d’exemple : Diagramme de configuration électroniqueDiagramme de configuration électroniqueFigure d’exemple : Générateur de schémas de la chaîne de transport d’électronsGénérateur de schémas de la chaîne de transport d’électronsFigure d’exemple : Schéma de régulation géniqueSchéma de régulation géniqueFigure d’exemple : Générateur de schémas de la glycolyseGénérateur de schémas de la glycolyseFigure d’exemple : Convertisseur d’image en SVG modifiableConvertisseur d’image en SVG modifiableFigure d’exemple : Schéma de la réponse immunitaireSchéma de la réponse immunitaireFigure d’exemple : Générateur de schémas du cycle de KrebsGénérateur de schémas du cycle de KrebsFigure d’exemple : Créateur de schémas de montage expérimentalCréateur de schémas de montage expérimentalFigure d’exemple : Générateur de schémas de la méioseGénérateur de schémas de la méioseFigure d’exemple : Générateur de diagrammes d’orbitales moléculairesGénérateur de diagrammes d’orbitales moléculairesFigure d’exemple : Générateur de schémas du cycle de l’azoteGénérateur de schémas du cycle de l’azoteFigure d’exemple : Créateur d’arbres généalogiquesCréateur d’arbres généalogiquesFigure d’exemple : Générateur de schémas de phospholipidesGénérateur de schémas de phospholipidesFigure d’exemple : Générateur de schémas du cycle du phosphoreGénérateur de schémas du cycle du phosphoreFigure d’exemple : Générateur de schémas de la photosynthèseGénérateur de schémas de la photosynthèseFigure d’exemple : Créateur d’arbres phylogénétiquesCréateur d’arbres phylogénétiquesFigure d’exemple : Diagramme de vecteursDiagramme de vecteursFigure d’exemple : Générateur de schémas de cellule végétaleGénérateur de schémas de cellule végétaleFigure d’exemple : Générateur de schémas de la synthèse des protéinesGénérateur de schémas de la synthèse des protéinesFigure d’exemple : Créateur de carrés de PunnettCréateur de carrés de PunnettFigure d’exemple : Créateur de tracés de rayonsCréateur de tracés de rayonsFigure d’exemple : Générateur de palettes de couleurs scientifiquesGénérateur de palettes de couleurs scientifiquesFigure d’exemple : Schéma de signalisation cellulaireSchéma de signalisation cellulaireFigure d’exemple : Créateur de schémas unifilairesCréateur de schémas unifilairesFigure d’exemple : Schéma d’activation des lymphocytes TSchéma d’activation des lymphocytes TFigure d’exemple : Générateur de schémas du cycle de l’eauGénérateur de schémas du cycle de l’eauFigure d’exemple : Générateur de schémas de Western blotGénérateur de schémas de Western blot

Graphiques et courbes statistiques

28 outils
Figure d’exemple : Générateur de diagrammes de BodeGénérateur de diagrammes de BodeFigure d’exemple : Créateur de graphiques en toile d’araignéeCréateur de graphiques en toile d’araignéeFigure d’exemple : Courbe de survie de Kaplan-MeierCourbe de survie de Kaplan-MeierFigure d’exemple : Créateur de camemberts multicouchesCréateur de camemberts multicouchesFigure d’exemple : Générateur de courbe en clocheGénérateur de courbe en clocheFigure d’exemple : Générateur de diagrammes de GanttGénérateur de diagrammes de GanttFigure d’exemple : Générateur de boîtes à moustachesGénérateur de boîtes à moustachesFigure d’exemple : Forest plotForest plotFigure d’exemple : Générateur de volcano plotsGénérateur de volcano plotsFigure d’exemple : Créateur de diagrammes de ParetoCréateur de diagrammes de ParetoFigure d’exemple : Créateur de nuages de pointsCréateur de nuages de pointsFigure d’exemple : Générateur de heatmapsGénérateur de heatmapsFigure d’exemple : Générateur de graphiques par IAGénérateur de graphiques par IAFigure d’exemple : Créateur de graphiques comparatifsCréateur de graphiques comparatifsFigure d’exemple : Générateur de diagrammes de SankeyGénérateur de diagrammes de SankeyFigure d’exemple : Générateur de graphiques radarGénérateur de graphiques radarFigure d’exemple : Créateur d’histogrammesCréateur d’histogrammesFigure d’exemple : Graphique en barresGraphique en barresFigure d’exemple : Générateur de plan cartésienGénérateur de plan cartésienFigure d’exemple : Créateur de diagrammes en pointsCréateur de diagrammes en pointsFigure d’exemple : Calculateur IC50 et courbes dose-réponseCalculateur IC50 et courbes dose-réponseFigure d’exemple : Calculateur DPICalculateur DPIFigure d’exemple : Schéma d’onde transversaleSchéma d’onde transversaleFigure d’exemple : Graphique en courbeGraphique en courbeFigure d’exemple : Générateur de droite graduéeGénérateur de droite graduéeFigure d’exemple : Vérification des figuresVérification des figuresFigure d’exemple : Graphique d’offre et de demandeGraphique d’offre et de demandeFigure d’exemple : Graphique en cascadeGraphique en cascade

Logigrammes, cadres conceptuels et schémas de structure

32 outils
Figure d’exemple : Générateur de cadre conceptuelGénérateur de cadre conceptuelFigure d’exemple : Générateur de cadre théoriqueGénérateur de cadre théoriqueFigure d’exemple : Générateur d’arbres syntaxiquesGénérateur d’arbres syntaxiquesFigure d’exemple : Créateur de clés dichotomiquesCréateur de clés dichotomiquesFigure d’exemple : Générateur de diagrammes de phrasesGénérateur de diagrammes de phrasesFigure d’exemple : Générateur de diagrammes à partir de texteGénérateur de diagrammes à partir de texteFigure d’exemple : Générateur de diagrammes PRISMAGénérateur de diagrammes PRISMAFigure d’exemple : Générateur de diagrammes de workflowGénérateur de diagrammes de workflowFigure d’exemple : Générateur de frises chronologiquesGénérateur de frises chronologiquesFigure d’exemple : Matrice de synthèseMatrice de synthèseFigure d’exemple : Générateur de diagrammes ERGénérateur de diagrammes ERFigure d’exemple : Générateur de diagrammes UMLGénérateur de diagrammes UMLFigure d’exemple : Générateur de diagrammes arborescentsGénérateur de diagrammes arborescentsFigure d’exemple : Générateur de diagrammes d’IshikawaGénérateur de diagrammes d’IshikawaFigure d’exemple : Générateur de schémas de réseaux de neuronesGénérateur de schémas de réseaux de neuronesFigure d’exemple : Générateur d’arbres de décisionGénérateur d’arbres de décisionFigure d’exemple : Générateur de diagrammes d’architecture logicielleGénérateur de diagrammes d’architecture logicielleFigure d’exemple : Générateur de diagrammes de flux CONSORTGénérateur de diagrammes de flux CONSORTFigure d’exemple : Créateur de diagrammes de contexteCréateur de diagrammes de contexteFigure d’exemple : Générateur de diagrammes de flux de donnéesGénérateur de diagrammes de flux de donnéesFigure d’exemple : Schéma de protocole expérimentalSchéma de protocole expérimentalFigure d’exemple : Créateur de génogrammesCréateur de génogrammesFigure d’exemple : Générateur d’organisateurs graphiquesGénérateur d’organisateurs graphiquesFigure d’exemple : Image en logigrammeImage en logigrammeFigure d’exemple : Convertisseur Mermaid en PNGConvertisseur Mermaid en PNGFigure d’exemple : Générateur de schémas réseauGénérateur de schémas réseauFigure d’exemple : Créateur d’organigrammesCréateur d’organigrammesFigure d’exemple : Générateur de diagrammes de séquenceGénérateur de diagrammes de séquenceFigure d’exemple : Générateur de diagrammes d’étatsGénérateur de diagrammes d’étatsFigure d’exemple : Générateur de diagrammes en couloirsGénérateur de diagrammes en couloirsFigure d’exemple : Générateur de diagrammes de cas d’utilisationGénérateur de diagrammes de cas d’utilisationFigure d’exemple : Générateur de diagrammes de VennGénérateur de diagrammes de Venn
Voir tous les outils →

Questions sur le diagramme Mermaid

1.

2.

3.

4.

5.

6.

Arrière-plan d'appel à l'action

Diagramme mermaid

Créer le diagramme Mermaid

Créer le diagramme Mermaid

Gratuit pour commencer · Pas de carte de crédit requise · Conçu pour les chercheurs