# Mernyx vs VS Code for Mermaid: preview or editor

VS Code draws Mermaid in the Markdown preview — a picture inside a document. Mernyx is for the case where the diagram is the file, and you want to change it with the mouse.

[Buy Mernyx Pro — $19](https://checkout.dodopayments.com/buy/pdt_0NqGkcihHxe79ekZgVhC4?redirect_url=https%3A%2F%2Fmernyx.com%2Fthanks%2F)

[Download free](https://releases.mernyx.com/Mernyx-1.0.0.dmg)

## Why Mernyx

What Mernyx does on the three rows where the two tools part ways.

### Your file

It edits the .mmd file itself.

### Changing it on the canvas

Supported

### Finder preview

Supported

## When VS Code is the right choice

If you already write your documentation in VS Code, the built-in Mermaid preview is the shortest path.

A diagram inside a Markdown document is a picture in a document, and VS Code renders it well — no extension, no preview server, no second window. Mernyx is for the moment the picture stops being a picture and becomes the file: you want to move a node, and the source has to change with it. Many people keep both, and the question is not which one is better but which one you are holding.

## Mechanism by mechanism

One row per feature. The left column is Mernyx; the right one is the tool this page is about.

- Drawn natively
  - ✓ Mernyx: Drawn natively: every node is a real view, and the layout is computed on your Mac.
  - ◐ VS Code: Rendered with non-native technology.
- Your file
  - ✓ Mernyx: It edits the .mmd file itself.
  - ◐ VS Code: The diagram lives in a Mermaid code fence in a Markdown document.
- Finder preview
  - ✓ Mernyx: Supported
  - ○ VS Code: Not supported
- Finder thumbnail
  - ✓ Mernyx: Supported
  - ○ VS Code: Not supported
- Changing it on the canvas
  - ✓ Mernyx: Supported
  - ○ VS Code: Not supported
- Working offline
  - ✓ Mernyx: Compiling, layout and export happen on your Mac, so it works the same with no network.
  - ✓ VS Code: VS Code is a local app: the diagram draws the same with no network.
- Export
  - ✓ Mernyx: PNG, SVG and PDF, no watermark, at whatever size you want.
  - ○ VS Code: The preview draws the diagram and copies its source. It does not export an image.
- Nothing to install
  - ✓ Mernyx: One app. No extension to install, no runtime to set up.
  - ✓ VS Code: Needs an extension installed.
- Sharing
  - ✓ Mernyx: Share the file
  - ✓ VS Code: Share the file
- Icons
  - ✓ Mernyx: Supported
  - ✓ VS Code: Supported
- AI
  - ✓ Mernyx: Bring your own key: you supply the endpoint and the key, completely free of restrictions.
  - ◐ VS Code: VS Code ships no Mermaid AI of its own.
- No account needed
  - ✓ Mernyx: No account needed
  - ✓ VS Code: No account needed

## Questions

### Does VS Code render Mermaid now?

Only from inside Markdown, or by installing a third-party extension.

### So why a separate app?

Stronger visual editing, integration with macOS system features such as Quick Look, and native high-performance rendering.

### Can I move a node in VS Code and have the Mermaid source change?

Not in the built-in preview — what it renders is a result, not an editable canvas. In Mernyx the canvas and the source are two views of one document: dragging a node rewrites the source, and editing the source redraws the canvas.

## Try it free.

Download it, open a file you already have, and see whether the canvas earns its $19 when you need to change something.

[Buy Mernyx Pro — $19](https://checkout.dodopayments.com/buy/pdt_0NqGkcihHxe79ekZgVhC4?redirect_url=https%3A%2F%2Fmernyx.com%2Fthanks%2F)

[Download free](https://releases.mernyx.com/Mernyx-1.0.0.dmg)