Mermaid-diagrammen insluiten
Maak een Mermaid-diagram en krijg een deelbare iframe-code die je in elke website kunt insluiten. Gratis, direct, geen account nodig.
Mermaid-diagrammen insluiten
Maak een Mermaid-diagram en krijg een deelbare iframe-code die je in elke website kunt insluiten. Gratis, direct, geen account nodig.
Jouw Mermaid-code
Live voorbeeld
Insluitcode
<iframe
src="https://mermaideditor.com/embed?code=Z3JhcGglMjBURCUwQSUyMCUyMCUyMCUyMEElNUJTdGFydCU1RCUyMC0tJTNFJTIwQiU3QklzJTIwaXQlMjB3b3JraW5nJTNGJTdEJTBBJTIwJTIwJTIwJTIwQiUyMC0tJTIwWWVzJTIwLS0lM0UlMjBDJTVCU2hpcCUyMGl0JTVEJTBBJTIwJTIwJTIwJTIwQiUyMC0tJTIwTm8lMjAtLSUzRSUyMEQlNUJEZWJ1ZyU1RCUwQSUyMCUyMCUyMCUyMEQlMjAtLSUzRSUyMEI=&theme=default"
width="100%"
height="400"
frameborder="0"
style="border-radius:8px;overflow:hidden"
></iframe>Voor ontwikkelaars
Je kunt insluit-URL's programmatisch genereren zonder deze editor te gebruiken. De diagramcode is gecodeerd als URL-veilige base64.
URL-formaat
https://mermaideditor.com/embed?code={encoded}&theme={theme}Hoe te coderen
// JavaScript const encoded = btoa(encodeURIComponent(mermaidCode)) const embedUrl = `https://mermaideditor.com/embed?code=${encoded}&theme=default` // Python import base64, urllib.parse encoded = base64.b64encode(urllib.parse.quote(mermaid_code).encode()).decode() embed_url = f"https://mermaideditor.com/embed?code={encoded}&theme=default"Ondersteunde thema's: default · dark · forest · neutral
Hoe je een Mermaid-diagram insluit
Schrijf je Mermaid-diagramcode in de editor hierboven
Kopieer de gegenereerde iframe-code met één klik
Plak het in een website, blogpost of documentatiepagina
Waar te gebruiken
GitHub & GitLab
Sluit live diagrammen in wiki-pagina's, issue-beschrijvingen of projectdocumentatie in.
Documentatiesites
Voeg interactieve diagrammen toe aan Confluence, Notion of elk HTML-gebaseerd documentatieplatform.
Blogposts
Verrijk technische artikelen met architectuurdiagrammen, stroomdiagrammen en sequentiediagrammen.
Interne wiki's
Houd teamkennisbanken visueel en up-to-date met ingesloten diagrammen.
Veelgestelde vragen
Is de insluitfunctie gratis?
Ja, volledig gratis. Er zijn geen gebruikslimieten, geen account vereist, en de gegenereerde iframe-URL's werken voor onbepaalde tijd.
Welke browsers ondersteunen het ingesloten diagram?
De insluitviewer werkt in alle moderne browsers, waaronder Chrome, Firefox, Safari en Edge. Het gebruikt standaard HTML5 en JavaScript.
Kan ik de iframe-grootte aanpassen?
Ja — pas gewoon de width- en height-attributen in de gegenereerde iframe-code aan om het aan je lay-out aan te passen. Je kunt ook CSS toevoegen om het responsief te maken.