Markdown Viewer

Paste Markdown on the left, see rendered HTML on the right. Everything runs in your browser — share a link with the whole document compressed into the URL.

Markdown

# Welcome to md.tooljo.com

A fast, **100% client-side** markdown viewer. Your text never leaves
the browser — open DevTools → Network and verify.

## What works

- GFM (tables, task lists, strikethrough, fenced code)
- ~~Strikethrough~~ and **bold** and *italic* and `inline code`
- [Links](https://tooljo.com), images, blockquotes, footnotes

## Tables

| Feature | Status | Notes |
|---|---|---|
| Live preview | ✅ | as you type |
| URL-hash share | ✅ | click "Share" |
| Privacy | ✅ | nothing leaves your browser |

## Code

```js
function greet(name) {
  return `Hello, ${name}!`;
}
```

## Task list

- [x] Render markdown
- [x] Render tables
- [x] Render Mermaid diagrams
- [ ] Add KaTeX math (coming soon)

## Mermaid diagrams

Type a fenced ```mermaid block and the preview renders it as an SVG.
The library lazy-loads — it only fetches when there's a diagram to draw.

```mermaid
graph LR
  A[Markdown source] --> B(marked parses)
  B --> C{has mermaid blocks?}
  C -->|no| D[Plain HTML output]
  C -->|yes| E[Lazy-load mermaid]
  E --> F[Render SVG diagrams]
  F --> D
```

> Click "Share" below to copy a link that contains this whole document
> compressed into the URL fragment. No backend involved.

Rendered

What this does

Live preview. Two-pane layout, instant render as you type. Toggle between split, preview-only, or source-only views.
GitHub-Flavored Markdown. Tables, task lists, strikethrough, fenced code, autolinks — everything GitHub renders.
Copy or download HTML. Get the rendered HTML as inner content (paste into your CMS) or as a complete styled document (download as .html).
Shareable URL. Click "Share" — your markdown gets compressed into the URL hash. Send the link; anyone sees your preview, no backend.
Privacy. Nothing leaves your browser. Open DevTools → Network and watch — no requests are made.

How it compares

The popular online markdown editors fall into two camps:

Heavy SaaS (StackEdit, Dillinger, HackMD) — feature-rich, but slow first paint and they push you to log in for cloud sync.
Light static (a few one-page sites) — fast, but missing tables / dark mode / share / export.

This tool sits between the two: fast static load + the table-stakes feature set + a share link nobody else does. The full design rationale is in our benchmark notes.

Tips

Hash sharing. The URL fragment after #m= is the LZ-compressed source. You can decode it yourself with the lz-string npm package's decompressFromEncodedURIComponent.
Mobile. Split view stacks vertically below 760px; the toolbar is sticky.
Dark mode. Follows your OS preference automatically. The rendered output uses GitHub-style theming for both light and dark.
Word count. Shown in the status bar — handy for blog post drafts and SEO targets.

Related tools

Markdown → HTML — same engine, no live editing, focused on bulk conversion
HTML → Markdown — paste HTML (e.g. from a Word doc or web page), get clean Markdown back
Cheat sheet — every Markdown syntax on one page

FAQ

Is anything sent to a server?

No. The whole tool runs in your browser. Open DevTools → Network and verify — no requests are made while you type.

How does the share link work?

Click 🔗 Share link. The current markdown is LZ-string compressed and packed into the URL fragment (after #m=). Anyone who opens that URL sees the same preview — no backend, no storage, no account.

How big a document can the share link hold?

Browsers tolerate URLs up to ~32K characters. The compressor typically gets ~50% reduction on prose, so a comfortable cap is ~15KB of markdown source per share link. For longer documents, save the markdown locally and share the file.

What flavor of Markdown does this support?

GitHub-Flavored Markdown (GFM): tables, task lists, strikethrough, fenced code, autolinking. Standard CommonMark plus GFM extensions.

Why don't I see math / Mermaid diagrams?

Coming soon. The MVP keeps the bundle tiny by skipping KaTeX and Mermaid (they'd add ~250KB combined). They'll be lazy-loaded on demand in a future update.

Can I open a markdown file from disk?

Drag-and-drop file support is on the roadmap. For now, open the file in your editor, copy the contents, and paste into the source pane.

Is the rendered HTML safe to paste into my site?

Yes — output is sanitized through DOMPurify, which strips <script>, event handlers, and other risky patterns. Use the 'Copy HTML' button for production-safe HTML.