Welcome to Markdown Editor
Write Markdown on the left and see the live preview on the right.
Text Formatting
You can write bold, italic, strikethrough, and inline code.
Code Blocks
function greet(name) {
return `Hello, ${name}!`;
}
console.log(greet('World'));
Tables
| Feature | Supported | Notes |
|---|---|---|
| GFM Tables | ✅ Yes | Responsive styling |
| Task Lists | ✅ Yes | Interactive preview |
| Code Blocks | ✅ Yes | Syntax ready |
Task List
- Live preview
- Toolbar shortcuts
- Export to .md and HTML
- Add more features
Blockquote
"Markdown is intended to be as easy-to-read and easy-to-write as is feasible."
— John Gruber
Start editing to see changes live!
You Might Also Like
Markdown Editor Online Free — Live Preview & Export
About this tool
Write, Preview, and Export Markdown in Your Browser — No Install Required
You open a README, write a doc, or draft a blog post in Markdown, but you're switching between a text file and a browser tab to see what it actually looks like. This tool puts the editor and the live preview side-by-side in a single page, updating the rendered output as you type — no save, no reload, no extension required.
The editor supports GitHub Flavored Markdown (GFM) — the same dialect used on GitHub, GitLab, npm, and most documentation platforms. That means tables, task lists with checkboxes, fenced code blocks with language identifiers, strikethrough, and auto-linking all work out of the box. The SAMPLE document that loads on first visit demonstrates every supported feature so you can see immediately what the tool can render.
The toolbar gives you one-click insertion for all the constructs that require exact syntax: heading levels, bold, italic, strikethrough, inline code, code blocks, blockquotes, unordered and ordered lists, task list items, links, images, tables, and horizontal rules. Keyboard shortcuts cover the most common operations — Ctrl+B for bold, Ctrl+I for italic, Ctrl+K for link — with Tab inserting two-space indentation.
The editor auto-saves to localStorage after 1 second of inactivity and restores your draft automatically on next visit. The "✓ Saved" indicator in the footer confirms each save. Three view modes let you switch between a side-by-side split for editing, a distraction-free editor-only mode, and a full-screen preview.
When you're done, the footer gives you four export options: copy the raw Markdown source, copy the rendered HTML fragment, download a .md file, or download a complete standalone .html file with embedded typography styles — ready to open in any browser or drop into a static site.
All rendering happens in your browser using the marked library. No content is ever sent to a server, logged, or stored outside your own browser's localStorage. Safe for private notes, internal docs, or any sensitive writing.
Features
- Real-time GFM preview — renders GitHub Flavored Markdown as you type; supports tables, task lists, fenced code blocks, strikethrough, and auto-links via the marked library
- Split / Editor / Preview modes — three view modes via the segmented control; Split shows editor and preview side-by-side; use Diff Checker to compare two versions of a document
- Formatting toolbar — 15 buttons across 5 groups: H1–H3 headings, Bold/Italic/Strikethrough, inline code/code blocks, blockquote/ul/ol/task lists, and link/image/table/hr insertion
- Keyboard shortcuts — Ctrl+B bold, Ctrl+I italic, Ctrl+K link, Tab for two-space indentation; works with selected text (wraps selection) or without (inserts placeholder)
- localStorage auto-save — drafts saved after 1 s of inactivity and restored on next visit; "✓ Saved" indicator in footer; click Reset to clear; pairs well with AI Prompt Studio for drafting prompts
- Scroll sync — editor and preview scroll positions stay approximately in sync in Split mode; proportional scroll based on percentage position
- Live stats — word count, character count, and line count update continuously in the footer as you write; useful for blog posts and documentation with length targets
- Copy Markdown — copies the raw source to clipboard for pasting into GitHub, GitLab, Notion, or any Markdown-aware input
- Copy HTML — copies the rendered HTML fragment; paste into any CMS, email template builder, or HTML Formatter for cleanup
- Export .md — downloads a plain text
.mdfile nameddocument.md; ready to commit to a repository or open in any Markdown editor - Export .html — downloads a complete standalone HTML page with embedded CSS reset for clean typography, code blocks, tables, and blockquotes; open in any browser
- XSS-safe rendering — inline sanitizer strips
<script>tags,<iframe>embeds,on*event handlers, andjavascript:URLs from rendered HTML before display; safe to use with untrusted Markdown input - 100% client-side — no server, no sign-up, no analytics capturing your content; works offline once loaded; all processing runs in the browser
How to Use
Starting out: The editor loads with a sample Markdown document demonstrating all supported features — tables, code blocks, task lists, blockquotes, and inline formatting. Edit it directly or click Reset to clear and start from scratch.
Writing: Type Markdown in the left pane (Split mode) or the full-width editor (Editor mode). The preview updates in real time. Use the toolbar buttons for one-click formatting or the keyboard shortcuts: Ctrl+B (bold), Ctrl+I (italic), Ctrl+K (link), Tab (two-space indent).
Formatting shortcuts — with selection: Select text first, then click a toolbar button or use a shortcut. The selected text is wrapped with the appropriate Markdown markers. For example, selecting "important" and pressing Ctrl+B produces important.
Formatting shortcuts — without selection: Click a toolbar button without selecting text to insert a placeholder. For links, clicking 🔗 inserts [link text](url) and selects "link text" so you can type your label immediately.
Switching views: Use the Editor / Split / Preview segmented control in the header. Split is the default. Switch to Editor for distraction-free writing or Preview to focus on the rendered output.
Saving and restoring: Your content auto-saves to localStorage after 1 second of inactivity. The "✓ Saved" indicator confirms each save. Close the tab, reopen it, and your draft is restored automatically.
Exporting: Use the four footer buttons — Copy MD copies the raw Markdown, Copy HTML copies the rendered HTML fragment, ↓ .md downloads a Markdown file, ↓ .html downloads a complete standalone HTML page with embedded styles.
Common Use Cases
Frequently Asked Questions
Full GitHub Flavored Markdown (GFM): headings (H1–H6), bold, italic, strikethrough, inline code, fenced code blocks with language identifiers, blockquotes, unordered and ordered lists, task lists with checkboxes, tables, horizontal rules, links, images, and auto-linking. Rendered via marked with gfm and breaks modes enabled.
Yes. The editor saves to localStorage after 1 second of inactivity. "✓ Saved" appears in the footer when the save completes. Drafts are restored automatically on next visit. Nothing is sent to a server — all saving is local to your browser.
Yes — two ways. "Copy HTML" copies the rendered HTML fragment to your clipboard. "↓ .html" downloads a complete standalone HTML file with embedded CSS for typography, code blocks, tables, and blockquotes. Open it in any browser or host it as a static page.
Ctrl+B (Cmd+B) for bold, Ctrl+I (Cmd+I) for italic, Ctrl+K (Cmd+K) for link insertion, and Tab for two-space indentation. Shortcuts wrap selected text or insert a placeholder when no text is selected.
Yes. Everything runs in your browser — no content is ever sent to a server, logged, or accessible to anyone else. LocalStorage saves are local to your device. The editor also sanitizes rendered HTML to prevent XSS, stripping scripts, iframes, event handlers, and javascript: URLs.
Click the ⊞ button in the toolbar to insert a 3-column table template. Tables use pipe characters: | Col 1 | Col 2 | on the header row, |-------|-------| as the separator, and | Cell | Cell | for data rows. Align columns with colons: |:---| left, |:---:| center, |---:| right.
Split shows editor and preview side-by-side and is the default. Editor shows only the writing area — best for distraction-free writing on small screens. Preview shows only the rendered output — good for reviewing the final document before exporting.
Yes. The preview pane re-renders on every keystroke using a memoized call to the marked parser. There is no manual refresh step. Scroll positions are also kept in approximate sync — scrolling the editor scrolls the preview to the same relative position.