CodeMirror Live Markdown

Live Preview Demo - Move your cursor into formatted text to see the magic ✨

Basic Table (Default Plugin)

Click into the table to edit Markdown source.

Advanced Table (Editable Cells)

Edit headers and cells directly, use the MD button to switch to source.

Code Block Auto (Default)

Cursor enters code block = source mode. Cursor leaves = rendered preview.

Code Block Inline Editing (New)

Click inside code to edit directly. Fences are hidden; use MD to show source.

Code Block Toggle

Default is rendered preview. Use MD / Code buttons to switch source mode.

💡 Try this: Try the new inline code block editing: click inside any code block to place your cursor and type. Then click MD to see the raw fences.