Mermaid OnlineTools
Mermaid export style gallery

Choose the Mermaid style before you export

Compare publish-ready Mermaid themes for docs, README files, dark knowledge bases, slides, blogs, and hand-drawn whiteboard explainers. The goal is not decoration — it is choosing the right export surface before downloading.

Theme examples

Each card uses the Mermaid type that best sells that preset, so the gallery feels like real export examples instead of repeated thumbnails.

9 presets
Clean Docspreview
WritePreviewExportDocs

Clean Docs

Best for documentation.

A crisp white canvas for technical docs and wiki pages.

Sketch Paperpreview
ClientServicerequestresponse

Whiteboard Sketch

Best for workshops and architecture notes.

Hand-drawn roughjs geometry on warm paper for explainers.

Dark exportpreview
USEREXPORTid · emailformat · scalecreates

GitHub Dark

Best for dark docs.

Navy code-document styling with readable light labels.

Transparent Docspreview
Exporter+ format+ download()Theme+ preset()

Transparent Docs

Best for slides and README files.

Checkerboard preview for transparent PNG/SVG exports.

Blog cardpreview
FastPolishedImpact vs effort

Editorial Card

Best for technical blogs.

Warm paper treatment for article illustrations.

4x · transparentpreview
DraftReviewExportShareRelease diagram

Presentation Clear

Best for slides.

Larger margins and transparent output for decks.

Linear Darkpreview
DraftPreviewexport

Linear Dark

Best for modern product specs.

A sharper dark preset for product changelogs and internal specs.

Deck exportpreview
Project rolloutPlanBuildQAShip

Executive Deck

Best for leadership decks.

Restrained board-deck spacing with high-resolution output in mind.

Tokyo Nightpreview
ThemeDocsSlidesDarkBlogs

Tokyo Night

Best for engineering posts.

Blue-toned dark styling for technical posts and dashboard docs.

How to choose a style

Docs and wikis

Start with Clean Docs or GitHub README when the diagram needs to disappear into documentation.

Workshops and explainers

Use Whiteboard Sketch when the diagram is part of a narrative, workshop board, or architecture walkthrough.

Dark surfaces

Use GitHub Dark, Linear Dark, or Tokyo Night when the destination page itself is dark.

Slides and articles

Use Presentation Clear or Editorial Card when the export needs to feel like a designed asset, not a screenshot.