How to Preview Markdown in Visual Studio Code

The versatile VS Code editor can also handle Markdown preview with ease. Time to game up your README.md.
Warp Terminal

Have you ever heard of do it all software? If not, then the VS Code will be the perfect example for it.

You can find support for almost every programming language possible to plug-ins that will let you extend its features more than you can imagine.

One of which is using the VS Code as a markdown text editor.

The easiest way to get the preview pane for markdown is to press the Ctrl + K and then V.

Want more details? Here you have it.

How to preview markdown in VS Code

There are two ways to preview markdown in VS Code:

  • Using the side panel (recommended)
  • Open preview in the new tab

Before we get into details, make sure the file you are working on has the .md extension (indicates markdown file).

Preview markdown on the side panel

Preview markdown in next panel

There are two ways you can get the preview panel in markdown:

  • Using shortcut
  • By pressing the preview button

Using shortcut

If you want to use the shortcut, all you have to do is press the Ctrl + K and then press the V key and it will bring the preview panel:

get preview of markdown in side panel using shortcut

As you can see, it brings a preview panel to the right side of the current file.

Using the preview button

If you don't like the idea of using shortcuts for everything, there's a preview button available in VS Code by which you can bring the preview panel easily.

Here's where it is located at:

Preview button in markdown vs code

When pressed, here's how it gets you a preview:

use preview button in vs code to get the preview of markdown

Pretty easy way in my opinion, especially if you are just getting started with VS Code and you are not comfortable using the shortcuts yet.

Preview markdown in a different tab

Preview markdown in different tab in vs code

Unlike the previous method, this will open the preview in a different tab which can be useful if you're working on multiple projects and don't want to spare the half screen just for the preview.

To use this, all you have to do is press Ctrl + Shift + V (I know it looks familiar as you use the same command to paste text in the terminal):

get preview of markdown in different tab in VS Code

More on VS Code

Here's how you can comment multiple lines at once in VS Code:

How to Comment Multiple Lines in VS Code
Here are a couple of tips on commenting out multiple lines of code in VS Code.

Want to declutter VS Code terminal? Here's how you do it:

How to Clear Terminal in VS Code
Don’t like the cluttered terminal screen in VS Code? Here’s how to clear it with a keyboard shortcut.

I hope you will find this helpful.

About the author
Sagar Sharma

Sagar Sharma

A software engineer who loves to write about his experience with Linux. While reviving my crashed system, you can find me reading literature, manga, or watering my plants.

Become a Better Linux User

With the FOSS Weekly Newsletter, you learn useful Linux tips, discover applications, explore new distros and stay updated with the latest from Linux world

itsfoss happy penguin

Great! You’ve successfully signed up.

Welcome back! You've successfully signed in.

You've successfully subscribed to It's FOSS.

Success! Check your email for magic link to sign-in.

Success! Your billing info has been updated.

Your billing was not updated.