Parsers rendering markdown like Macchiato?

Application
1

It might be a little off topic.

I really like how macchiato renders markdown, leaving the syntax characters.

I wonder how is this being called and if there are any other applications and libraries that support that.

2

Markdown Edit does something similar.

3

Versital Markdown might also fit what you’re looking for, and it’s based on CommonMark…

4

Stackedit also does similar to what you want.

If you need to embed the editor into your own projects, Codemirror’s markdown highlighting can be easily formatted via css to display markdown in a way that is as close to the end result as possible. I have included a sample script to create the codemirror instance that adds classes for all the formatting characters as well as custom classes so you can style them differently to any inline html.

CodeMirror.fromTextArea($('#myTextArea'), 
    {
        mode: 
        {
            name: 'text/x-markdown',
            highlightFormatting: true,
            fencedCodeBlocks: true,
            tokenTypeOverrides: {
                header: "md-header",
                code: "md-code",
                quote: "md-quote",
                list1: "md-list1",
                list2: "md-list2",
                list3: "md-list3",
                hr: "md-hr",
                image: "md-image",
                imageAltText: "md-imageAltText",
                imageMarker: "md-imageMarker",
                formatting: "md-formatting",
                linkInline: "md-linkInline",
                linkEmail: "md-linkEmail",
                linkText: "md-linkText",
                linkHref: "md-linkHref",
                em: "md-em",
                strong: "md-strong",
                strikethrough: "md-strikethrough"
            }
        }
    }
);
5

Thanks for all the answers. I’m especially interested in the not mac-osx only ones.