81

I am currently using Textmate to create Markdown documents, but it requires me to press CtrlOptionCmd + P everytime I want to 'update' the Markdown output window. Essentially I am using it like a word processor.

Is there a Markdown editor for Mac OS X which supports wysiwig/live update of the content? Perhaps Textmate already does this?

Improve this question
2

15 Answers 15

Reset to default
40

If you want to use TextMate, change your file's language association to 'HTML'. In the Preview window there is a drawer that offers the option pipe the text through 'Markdown.pl'. (See screenshot).

Markdown

The alternative I use for Makrdown is not an officially released app but personally I use markdownlive by Jonathan 'Wolf' Rentzsch. It's open source available on GitHub and will require you to compile it using Xcode. It also allows you to copy the Generated HTML (what I like to use it for quite a bit).

Improve this answer
5
  • I tried markdownlive. It works, but like you said its in development and is quite primitive in the way of syntax colouring. I will try you other method soon.
    – Brock Woolf
    Aug 12, 2010 at 6:54
  • 2
    you do not have to set your file type to html. if you use the markdown bundle, you just need to remove the key equivalent activation of preview in the bundle settings. then textmate's show web preview in the window menu will give you a live preview.
    – yanokwa
    Apr 25, 2011 at 19:08
  • What about multimarkdown?
    – Kirk Strobeck
    Aug 19, 2011 at 16:21
  • 5
    You don't have to build MarkdownLive yourself: github.com/rentzsch/markdownlive/downloads
    – Matt Ball
    Feb 16, 2012 at 18:21
  • +1 For @yanokwa's comment. I particularly like this fork of the markdown plugin, which nicely preserves things like indentation for unordered lists: github.com/fletcher/markdown.tmbundle
    – user72923
    Nov 4, 2012 at 22:30
62

There is also "Mou", a live editor for Mac OS X (Lion). It's still in beta, but works great! http://mouapp.com/

When current available Markdown editors are almost all for general writers, Mou is different: It's for web developers. Syntax highlighting, live preview, fullscreen mode, auto save, powerful actions, auto pair, incremental search, custom themes, HTML export, enhanced CJK characters support.

enter image description here

Improve this answer
1
  • 4
    Mou looks great, but requires Lion.
    – Thilo
    Dec 15, 2011 at 9:53
28

Mac only, Marked provides markdown and multi-markdown preview for any text editor. The preview is updated when you save the text file.

Marked screenshot

MarkdownPad is for Windows, but provides live preview.

MarkdownPad screenshot

ReText is available for other platforms and offers a live preview of rendered Markdown:

ReText is a simple text editor for Markdown syntax. It is written in Python using Qt libraries, able to run on any platforms (Linux and BSD are officially supported)

ReText screenshot

Although not officially supported, there are Windows installation instructions as well; however, I had to make a few modifications to get them to work (the complete set with my corrections is shown below):

Installation

  1. Install Python27
  2. Install PyQT precompiled for PyQt-Py2.7-x86-gpl-4.8.3-1.exe PyQt-Py2.7-x86-gpl-4.8.4-1.exe
  3. Install easy_install setuptools-0.6c11.win32-py2.7.exe
  4. Update your My Computer's Environmental Variables. Click Start, right-click My Computer and select Properties, select the Advanced tab, then click Environment Variables.
  5. Under System Variables, click New. Under variable name enter PYTHONPATH. Under Variable value enter C:\Python27\Lib\;C:\Python27\Lib\site-packages\
  6. Select the System Variable PATH click Edit. Update the PATH variable value by adding C:\Python27;C:\Python27\Lib\site-packages\PyQt4\bin; to the front of the existing entries so that it reads like PATH=C:\Python27;C:\Python27\Lib\site-packages\PyQt4\bin;...
  7. Install additional Python libraries. Select Start then Run, type cmd then cd \python27\scripts. Enter:
    • easy_install Pygments
    • easy_install ElementTree
    • easy_install Markdown
    • easy_install gdata
  8. Download and unpack current ReText (ATM 0.8.1)
  9. Download and unpack ReText icons
  10. Place the unpacked icons into the ReText\icons folder
  11. Navigate to the retext.py file (probably at c:\retext). Right-click drag-and-drop retext.py and select Create shortcuts here.
  12. Right-click on the shortcut to adjust the properties.
  13. Change target to "C:\Python27\python.exe" retext.py and Run to minimized.
  14. Change the icon (which will require you to make an .ico file from one of the .png files unzipped above into the ReText/icons directory, which can be done here
  15. Change the shortcut name on the general tab if desired.
Improve this answer
2
19

MarkdownLive does exactly what you want, free and open source.

Download the release through GitHub, or version 1.7.1 from here.

enter image description here

Improve this answer
7

BBEdit does this out of the box: set the current document type to be Markdown, open Preview in BBEdit, and type away. The preview window auto-updates, showing your text just the way you want it.

See page 277 of the BBEdit User Manual for details.

Improve this answer
1
  • Ugh! I like BBEdit for several reasons, but characterizing its ability to handle Markdown in a user-friendly way is a stretch. And BTW, your link is broken.
    – Seamus
    Aug 9, 2021 at 18:04
5

Emacs markdown mode gives you a live preview as you write, and also a full HTML/Browser preview with C-c C-p.

enter image description here

Improve this answer
4

nvALT - Notational Velocity Fork

nvalt

Improve this answer
1
3

vim-instant-markdown is a vim plugin that shows near-instant updates in your system default web browser. It even works in MacVim, though I had to fiddle with $PATH a little.

Improve this answer
1
  • 1
    Do you mind sharing what you did to your $PATH?
    – Eric Hu
    Apr 11, 2013 at 3:58
2

The recently revived Smultron can do that as well without pressing any keys:

  1. Set the "Preview Parser" to "Markdown" in the advanced preferences under "Really Advanced".
  2. Then open the preview window with "Tools" / "Preview". Voilà.
Improve this answer
2

Texts for Mac OS X and Windows.

Texts Screenshot

Improve this answer
1
  • 2
    Warning: the website buries the information that Texts is not free. You can use it only for 30 days before you must purchase a license.
    – Rory O'Kane
    Feb 20, 2014 at 15:02
1

Visual Studio Code (vscode) supports it out of the box

https://code.visualstudio.com/docs/languages/markdown

enter image description here

Improve this answer
1

An old, but still relevant, question. All the answers appear to be 8-10 years old, but I believe that Typora is the answer as of today.

AFAIK, there's nothing quite like it: As you type your markdown in the editor, Typora displays the "code". Once you've completed an actively-edited passage, Typora collapses it as rendered text.

It's also free ($) during its beta release phase.

Improve this answer
1
  • 1
    Apparently you are correct - thanks for the update. I don't even recall now how I concluded it was open source... perhaps something has changed? "Free during beta" has always been the case, but it's been beta for so long, I wondered if this was to become its perpetual state. But it appears now that beta will end "soon".
    – Seamus
    Aug 9, 2021 at 17:18
0

Windows users can use Resophnotes to write their text in Markdown and use the "HTML" icon to preview the marked up text then export the html formatted text.

http://www.resoph.com/ResophNotes/Welcome.html

Improve this answer
0

I might as well a link to my SU question - where I looked for the same, just PHP/JavaScript based (that can run on a locally installed server):

Markdown "single page" PHP web application with live preview? [closed] - Super User

Improve this answer
0

Nowadays, there's the beautiful MarkText among others.

Improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .