Markdown Editor for Notes
Write study notes in Markdown with a live preview.
Study notes
Key idea
The mitochondrion is the powerhouse of the cell.
- Produces ATP
- Has its own DNA
- Double membrane
Remember: ATP = adenosine triphosphate.
Inline code like E = mc^2 and a reference link.
- Read the chapter
- Summarise
- Self-test
Your notes are saved in this browser only — nothing is uploaded.
To write notes in Markdown, type plain text and add a few marks: # for a heading, - for a bullet, and **stars** for bold. The live preview renders it as you type, and your work saves in your browser automatically so it survives a refresh.
How to use it
Type plain text in the left pane with a few formatting marks — # for a heading, - for a bullet, **stars** for bold — and the right pane renders it live as you write. Use the copy button to lift the Markdown into another app, or Clear to start over. Your work is saved in this browser automatically, so it survives a refresh.
Why Markdown for study notes
Markdown keeps your notes structured but portable: the same text reads cleanly as raw characters and renders into headings, lists, and emphasis anywhere that understands Markdown — other editors, note apps, wikis, and code repositories. Because there is no hidden formatting, you can paste notes between tools without anything breaking, and the marks themselves stay readable even before they render. For a more guided layout, the Cornell notes template splits the page into cues, notes, and a summary.
- 1 Start a line with # for a heading. Use ## for a subheading and ### for a smaller one — the more # you add, the smaller the heading.
- 2 Wrap text in **double asterisks** for bold. Use *single asterisks* around a word or phrase for italic emphasis.
- 3 Begin lines with - or * for a bullet list. For a numbered list, start each line with 1. 2. 3. followed by a space.
- 4 Link with [visible text](https://example.com). Embed inline code by wrapping it in `backticks`, and fence a code block between two lines of ```.
- 5 Watch the live preview as you type. The right pane renders your formatted result instantly, and your work saves in this browser so it survives a refresh.
Markdown syntax cheatsheet
The syntax this editor renders in the live preview.
| You type | You get |
|---|---|
| # Heading | Large heading (one to three # for levels 1–3) |
| **bold** | bold text |
| *italic* | italic text |
| `code` | inline code |
| - item | Bullet list (also * or +) |
| 1. item | Numbered list |
| > quote | Blockquote |
| [text](url) | A clickable link |
| --- | Horizontal divider |
| ``` … ``` | Fenced code block |
Tips for cleaner notes
Leave a blank line between blocks. A heading, a paragraph, and a list each need their own line; a blank line tells the renderer where one block ends and the next begins.
Nest ideas with lists, not indentation. Bullet and numbered lists give structure that survives copy-paste, where manual spaces and tabs often don’t.
Use code formatting for anything literal. Wrap formulas, terms, or commands in backticks so they stand out and aren’t mistaken for emphasis — handy for notes like E = mc² or a definition you must quote exactly.