Mermaid

Mermaid Sequence Diagram Editor — Online, No Install

Q: Can I edit Mermaid sequence diagrams online?

Yes. Paste your Mermaid sequenceDiagram block into Sketmi and it converts it to the native editor format automatically. You can then edit it visually and export back to Mermaid, PlantUML, PNG or SVG. No install required.

Q: What Mermaid syntax does this support?

Sketmi supports Mermaid sequenceDiagram blocks including participants, actors, solid and dashed arrows (->>, -->>), activation boxes, notes, loop, alt/else, and opt fragments. The sequenceDiagram keyword is optional on import.

Paste a Mermaid sequenceDiagram block into Sketmi and edit it visually in your browser. Export back to Mermaid, or convert to PlantUML, PNG, or SVG — no Java, no CLI, no sign up.

Open Editor PlantUML Editor

How import and export works

Sketmi does not edit raw Mermaid syntax directly. Instead, it works like this: you import a Mermaid diagram, the editor converts it to its native plain-text format, you edit it visually with a live preview, and then you export back. The native syntax is similar to Mermaid's — most diagrams round-trip cleanly.

Open the editor at sketmi.com — no sign up needed.

Click Import → Import Mermaid in the toolbar. Paste your sequenceDiagram block (the sequenceDiagram keyword is optional).

Edit the diagram in the text panel. The diagram re-renders live as you type.

Export when done. Use Export → Export Mermaid for a .mmd file, Export PlantUML for .puml, or the PNG/SVG buttons for images.

Mermaid syntax example

Here is a Mermaid sequence diagram for a REST API request with a cache check. You can paste this directly into the Import Mermaid dialog:

sequenceDiagram
    actor Client
    participant API Gateway as GW
    participant Backend
    participant Cache

    Client->>GW: GET /api/products
    GW->>Cache: Check cache key
    Cache-->>GW: Cache miss
    GW->>Backend: Forward request
    alt 200 OK
        Backend-->>GW: 200 + JSON payload
        GW->>Cache: Store response (TTL 5min)
        GW-->>Client: Return products
    else Error
        Backend-->>GW: 500 Internal Error
        GW-->>Client: 503 Try again later
    end

After importing, you can rename participants, add messages, reorder the flow, and export back.

What Mermaid syntax is supported

Sketmi's Mermaid importer handles the most common sequence diagram constructs:

Participants and actors — participant Name, actor Name, aliased participants (participant "Long Name" as Short)
Message arrows — solid (->>, ->), dashed (-->>, -->)
Activation bars — activate / deactivate
Notes — note over, note left of, note right of
Loops and conditionals — loop, alt/else, opt
Title — title My Diagram

Where Mermaid diagrams render natively

A .mmd file exported from Sketmi can be used anywhere Mermaid is supported:

Platform	How to use it
GitHub	Wrap in a fenced code block tagged `mermaid` in any `.md` file or PR description
GitLab	Same fenced code block syntax — renders in issues, MRs, and wikis
Notion	Insert a code block, set language to Mermaid, paste the content
Obsidian	Fenced code block tagged `mermaid` in any note
VS Code	Markdown Preview Mermaid Support extension
Confluence	Requires a third-party Mermaid macro (PlantUML renders natively — see below)

Converting Mermaid to PlantUML

If your diagram needs to end up in Confluence or a JetBrains IDE, you can convert it in two steps without any local tooling:

Import your Mermaid diagram via Import → Import Mermaid
Export via Export → Export PlantUML to download a .puml file

The resulting PlantUML file uses standard @startuml / @enduml notation and renders in any PlantUML-compatible tool. See the PlantUML editor guide for more on PlantUML workflows.

Frequently asked questions

Can I edit Mermaid sequence diagrams online?

Yes. Paste your Mermaid sequenceDiagram block into Sketmi and it converts it to the native editor format automatically. You can then edit it visually and export back to Mermaid, PlantUML, PNG or SVG. No install required.

Does it export back to Mermaid?

Yes. After editing, use the Export Mermaid option in the toolbar to download a .mmd file compatible with GitHub, GitLab, Notion, and Obsidian.

What Mermaid syntax does this support?

Sketmi supports Mermaid sequenceDiagram blocks including participants, actors, solid and dashed arrows (->>, -->>), activation boxes, notes, loop, alt/else, and opt fragments. The sequenceDiagram keyword is optional on import.

Can I convert a Mermaid diagram to PlantUML?

Yes. Import your Mermaid diagram via Import Mermaid, then use Export PlantUML to download a .puml file. This is the fastest way to convert between the two formats without any local tooling.

Is this a Mermaid live editor?

It is a live editor, but it does not edit raw Mermaid syntax — it converts Mermaid to its own plain-text format and renders that live. If you need to edit raw Mermaid syntax directly, the official Mermaid Live Editor at mermaid.live is the right tool. Sketmi is better suited for editing, sharing, and exporting diagrams without any workflow setup.