Export guide

Every diagram you create in Wiremark can be exported as a vector SVG, a raster PNG, or shared as a URL. All export operations run entirely in your browser — nothing is sent to a server.

SVG export

SVG is the recommended format for most use cases. It scales to any size without losing quality and is small enough to embed directly in Markdown.

How to export:

1. Open the editor at /editor.
2. Write or paste your DSL.
3. Click Export SVG in the toolbar.
4. A file named wiremark.svg is downloaded to your machine.

Where to use SVGs:

• Embed in GitHub README files with ![Screen](./screens/users.svg)
• Drop into Confluence, Notion, or Linear as an image attachment
• Paste into Google Docs or Slides (Insert → Image → Upload)

PNG export

PNG is useful when the target system doesn’t support SVG (Jira issue descriptions, PowerPoint, Slack messages).

How to export:

1. Click Export PNG in the toolbar.
2. The export renders at 2× pixel density for crisp display on high-DPI screens.
3. A file named wiremark.png is downloaded.

PNG export uses the @resvg/resvg-js WebAssembly renderer. It runs in a Web Worker so it doesn’t block the editor.

Copy as Markdown

The Copy Markdown button writes a base64-encoded SVG image tag to your clipboard:

![Wiremark diagram](data:image/svg+xml;base64,...)

Paste it into any Markdown file for an inline image that is fully self-contained — no separate file needed. Works on GitHub, GitLab, and any renderer that supports base64 data URIs.

Shareable URLs

Every change to the editor is reflected in the page URL. The DSL is compressed with LZ-string and encoded in the ?d= query parameter.

To share:

• Copy the URL from your browser’s address bar, or
• Click Copy link in the toolbar — it copies the current URL to your clipboard.

Anyone with the link can open it in the editor and see your exact diagram. No account required.

URL length: A typical 30-line diagram compresses to roughly 300–400 characters. Very large diagrams (200+ lines) may produce URLs too long for some systems. In that case, export the file and share it as an attachment instead.

Attribution

Both SVG and PNG exports include a small Made with Wiremark text in the bottom-right corner. This is the only requirement for using Wiremark for free during the public beta. It can be removed in a future paid plan.

Export from templates

Template pages at /templates have the same toolbar as the editor. You can load a template, modify the DSL, and export without navigating away.