# Markdown Editor

> Write Markdown on the left, see the rendered HTML on the right. Live preview, character / word / line counts, copy HTML or Markdown, drag-drop a file to open it.

URL: https://uttir.com/markdown-editor
Categories: text-tools, developer-tools, generators, web-tools
Privacy: Your text stays in your browser. The preview is rendered locally — nothing is uploaded.

## About

A split-pane Markdown editor with a live HTML preview. Type on the left, the rendered HTML updates on the right as you type. No preview lag, no server round-trip — the conversion happens locally in your browser.

Useful for writing README files, blog posts, Slack messages, documentation, or any other Markdown content. The editor shows character, word, and line counts in the toolbar; you can copy the rendered HTML or the original Markdown, or drag-drop a .md file to open it.

## How to use

1. **Write or paste Markdown** — Type in the left pane, or paste from another app.
2. **Watch the preview** — The right pane updates as you type. No lag — preview is local.
3. **Copy or export** — Copy the rendered HTML, or the original Markdown, or download as a .md file.

## Examples

### A short README

The first three sections of a typical project README. Live preview renders the headings, the code block, and the list.

Input:

```
# Project

A short description.

## Install

```bash
npm install my-package
```

## Usage

- Bullet one
- Bullet two
```

Output:

```
A live HTML preview with a heading, a sub-heading, a code block, and an unordered list.
```

### A blog draft

Long-form Markdown with a link, an image, a quote, and emphasis. Tests the most common syntax in one document.

Input:

```
## Why I switched to local-first

I have been [writing locally](https://example.com) for years. The privacy angle matters more than people think.

> The best note-taking system is the one you actually use.

**Bold** and *italic* work too.
```

Output:

```
A live preview with a sub-heading, a paragraph with an inline link, a blockquote, and bold / italic text.
```

## FAQ

### Which Markdown features are supported?

Headings, bold, italic, inline code, fenced code blocks, links, images, ordered and unordered lists, blockquotes, horizontal rules, hard line breaks. Tables, footnotes, and task lists are not — for those, use a full-featured editor like Obsidian or VS Code.

### Is the rendered HTML sanitized?

Yes. The renderer escapes HTML in the input before producing output, so a markdown document with <script> tags in it produces a safe escaped version, not an executable script. The output is safe to paste into a static site or a blog post.

### Can I import a .md file?

Yes. Drag a .md file onto the editor, or click the file icon in the toolbar. The content goes into the editor; the preview updates immediately.

### Does the editor save my draft?

No. The editor does not persist anything to local storage or to a server. Reload the page and your draft is gone — paste from your clipboard or a real editor if you need persistence.

## Related tools

- [Markdown to HTML Converter](https://uttir.com/markdown-to-html) — Convert Markdown to clean HTML. Headings, lists, links, images, code blocks, blockquotes, and inline formatting.
- [Character Counter](https://uttir.com/character-counter) — Count characters, words, lines, and UTF-8 bytes as you type.
- [Word Counter](https://uttir.com/word-counter) — Count words, characters, sentences, and paragraphs in your text instantly.
- [HTML Entity Encoder/Decoder](https://uttir.com/html-entity-encoder-decoder) — Encode special characters to HTML entities (& < > " ’) and decode named, decimal, or hex entities back to text.
- [HTML Minifier](https://uttir.com/html-minifier) — Shrink HTML by stripping comments and collapsing whitespace. See byte savings in real time.

---

For the full HTML page with the live tool, visit https://uttir.com/markdown-editor.
This file is the markdown rendering at https://uttir.com/markdown-editor.md. See https://uttir.com/llms.txt for a site-wide summary.