Markdown WYSIWYG

This Visual Studio Code extension provides a WYSIWYG-like experience for markdown and MDX files. This extension is experimental. Feedback is welcome, and changes are likely to happen.

Table of Contents

• Installation
• Usage
• Features
• License

Installation

In Visual Studio Code open the command palette using Ctrl + Shift + P, paste the following command, and press Enter.

ext install remcohaszing.markdown-decorations

Usage

This extension is activated automatically when you open a markdown or MDX file.

Features

This extension provides some text decorations that make the markdown and MDX editing experience feel close to a WYSIWYG experience.

The following decorations are supported:

• Emphasis text is italic.
• Strong text is bold.
• Headers are bold.
• Deleted text is strike-through.
• Thematic breaks have an extended strike-through effect.
• Inline code has a darker background in light mode, and a lighter background in dark mode.
• HTML tags have a darker background in light mode, and a lighter background in dark mode.
• Code blocks have a darker background in light mode, and a lighter background in dark mode.
• Frontmatter has a darker background in light mode, and a lighter background in dark mode.
• Block quotes have a darker background in light mode, and a lighter background in dark mode. This effect increases as more block quotes are nested.
• MDX expressions have a darker background in light mode, and a lighter background in dark mode.

License

MIT © Remco Haszing