Documentation

Topics Overview Overview Linux macOS Windows VS Code for the Web Raspberry Pi Network Additional Components Uninstall VS Code Tutorial Copilot Quickstart User Interface Personalize VS Code Install Extensions Tips and Tricks Intro Videos Overview Setup Quickstart Overview Language Models Context Tools Agents Customization Trust & Safety Overview Agents Tutorial Agents Window Planning Memory Tools Subagents Local Agents Copilot CLI Cloud Agents Third-Party Agents Overview Chat Sessions Add Context Inline Chat Review Edits Checkpoints Artifacts Panel Debug Chat Interactions Prompt Examples Overview Instructions Prompt Files Custom Agents Agent Skills Language Models MCP Hooks Plugins Context Engineering Customize AI Test-Driven Development Edit Notebooks with AI Test with AI Test Web Apps with Browser Tools Debug with AI MCP Dev Guide OpenTelemetry Monitoring Inline Suggestions Smart Actions Best Practices Security Troubleshooting FAQ Cheat Sheet Settings Reference MCP Configuration Workspace Context Display Language Layout Keyboard Shortcuts Settings Settings Sync Extension Marketplace Extension Runtime Security Themes Profiles Overview Voice Interactions Command Line Interface Telemetry Basic Editing IntelliSense Code Navigation Refactoring Snippets Overview Multi-Root Workspaces Workspace Trust Tasks Debugging Debug Configuration Testing Port Forwarding Integrated Browser Overview Quickstart Staging & Committing Branches & Worktrees Repositories & Remotes Merge Conflicts Collaborate on GitHub Troubleshooting FAQ Getting Started Tutorial Terminal Basics Terminal Profiles Shell Integration Appearance Advanced Overview Enterprise Policies AI Settings Extensions Telemetry Updates Overview JavaScript JSON HTML Emmet CSS, SCSS and Less TypeScript Markdown PowerShell C++ Java PHP Python Julia R Ruby Rust Go T-SQL C# .NET Swift Working with JavaScript Node.js Tutorial Node.js Debugging Deploy Node.js Apps Browser Debugging Angular Tutorial React Tutorial Vue Tutorial Debugging Recipes Performance Profiling Extensions Tutorial Transpiling Editing Refactoring Debugging Quick Start Tutorial Run Python Code Editing Linting Formatting Debugging Environments Testing Python Interactive Django Tutorial FastAPI Tutorial Flask Tutorial Create Containers Deploy Python Apps Python in the Web Settings Reference Getting Started Navigate and Edit Refactoring Formatting and Linting Project Management Build Tools Run and Debug Testing Spring Boot Modernizing Java Apps Application Servers Deploy Java Apps GUI Applications Extensions FAQ Intro Videos GCC on Linux GCC on Windows GCC on Windows Subsystem for Linux Clang on macOS Microsoft C++ on Windows Build with CMake CMake Tools on Linux CMake Quick Start C++ Dev Tools for Copilot Editing and Navigating Debugging Configure Debugging Refactoring Settings Reference Configure IntelliSense Configure IntelliSense for Cross-Compiling FAQ Intro Videos Get Started Navigate and Edit IntelliCode Refactoring Formatting and Linting Project Management Build Tools Package Management Run and Debug Testing FAQ Overview Node.js Python ASP.NET Core Debug Docker Compose Registries Deploy to Azure Choose a Dev Environment Customize Develop with Kubernetes Tips and Tricks Overview Jupyter Notebooks Data Science Tutorial Python Interactive Data Wrangler Quick Start Data Wrangler PyTorch Support Azure Machine Learning Manage Jupyter Kernels Jupyter Notebooks on the Web Data Science in Microsoft Fabric Foundry Toolkit Overview Foundry Toolkit Copilot Tools Create Agents Models Playground Agent Builder Agent Inspector Evaluation Tool Catalog Fine-Tuning (Automated Setup) Fine-Tuning (Project Template) Model Conversion Tracing Profiling (Windows ML) FAQ File Structure Manual Model Conversion Manual Model Conversion on GPU Setup Environment Without Foundry Toolkit Template Project Migrating from Visualizer to Agent Inspector Overview Getting Started Resources View Deployment VS Code for the Web - Azure Containers Azure Kubernetes Service Kubernetes MongoDB Remote Debugging for Node.js Overview SSH Dev Containers Windows Subsystem for Linux GitHub Codespaces VS Code Server Tunnels SSH Tutorial WSL Tutorial Tips and Tricks FAQ Overview Tutorial Attach to Container Create Dev Container Advanced Containers devcontainer.json Dev Container CLI Tips and Tricks FAQ Default Keyboard Shortcuts Default Settings Substitution Variables Tasks Schema

On this page there are 8 sections

Markdown and Visual Studio Code

Working with Markdown files in Visual Studio Code is simple, straightforward, and fun. Besides VS Code's basic editing, there are a several Markdown-specific features that help you be more productive.

Note: To help get you started with editing Markdown files, you can use the Doc Writer profile template to install useful extensions (spell checker, Markdown linter) and configure appropriate setting values.

Editing Markdown

Document outline

The Outline view is a separate section in the bottom of the File Explorer. When expanded, it shows the symbol tree of the currently active editor. For Markdown files, the symbol tree is the Markdown file's header hierarchy.

The Outline view is a great way to review your document's header structure and outline.

Snippets for Markdown

VS Code includes some useful snippets that can speed up writing Markdown. This includes snippets for code blocks, images, and more. Press ⌃Space (Windows, Linux Ctrl+Space) (Trigger Suggest) while editing to see a list of suggested Markdown snippets. You can also use the dedicated snippet picker by selecting Insert Snippet in the Command Palette.

Tip: You can add in your own User Defined Snippets for Markdown. Take a look at User Defined Snippets to find out how.

Go to header in file

Use ⇧⌘O (Windows, Linux Ctrl+Shift+O) to quickly jump to a header in the current file.

You can browse through all headers in the file or start typing a header name to find just the one you are after. Once you've found the header you what, press Enter to move your cursor to it. Press Esc to cancel jumping to the header.

Go to header in workspace

Use ⌘T (Windows, Linux Ctrl+T) to search through headers across all Markdown files in the current workspace.

Start typing a header name to filter down the list and find the header you are after.

Path completions

Path completions help with create links to files and images. These paths are shown automatically by IntelliSense as you type the path of an image or link, and can also be manually requested by using ⌃Space (Windows, Linux Ctrl+Space).

Paths starting with / are resolved relative to the current workspace root, while paths staring with ./ or without any prefix are resolved relative to the current file. Path suggestions are automatically shown when you type / or can be manually invoked by using ⌃Space (Windows, Linux Ctrl+Space).

Path IntelliSense can also help you link to headers within the current file or within another Markdown file. Start the path with # to see completions for all the headers in the file (depending on your settings, you might need to use ⌃Space (Windows, Linux Ctrl+Space) to see these):

You can disable path IntelliSense with "markdown.suggest.paths.enabled": false.

Creating links to a header in another file

Need to link to a header in another Markdown document but don't remember or want to type out the full file path? Try using workspace header completions! To start, just type ## in a Markdown link to see a list of all Markdown headers from the current workspace:

Accept one of these completions to insert the full link to that header, even if it's in another file:

You can configure if/when workspace header completions show with the markdown.suggest.paths.includeWorkspaceHeaderCompletions Open in VS Code Open in VS Code Insiders setting. Valid setting values are:

onDoubleHash (the default)—Show workspace header completions only after you type ##.
onSingleOrDoubleHash—Show workspace header completions after you type # or ##.
never—Never show workspace header completions.

Keep in mind that finding all headers in the current workspace can be expensive, so there might be a slight delay the first time they are requested, especially for workspaces with lots of Markdown files.

Inserting images and links to files

In addition to path completion, VS Code also supports a few other ways to insert images and file links into your Markdown documents:

You can Drag and drop a file from VS Code's Explorer or from your operating system into a Markdown editor. Start by dragging a file from VS Code's Explorer over your Markdown code and then hold down Shift to start dropping it into the file. The preview cursor shows where it will be inserted when you drop it.

If you prefer using the keyboard, you can also Copy and paste a file or image data into a Markdown editor. When you paste a file, a link to a file, or a URL, you can choose to insert a Markdown link or to include the link as plain text.

Or you can use the Markdown: Insert Image from Workspace command to insert images and Markdown: Insert Link to File in Workspace to insert file links.

Inserted images use Markdown image syntax ![](path/to/image.png). Links insert a normal Markdown link [](path/to/file.md).

By default VS Code automatically copies dropped or pasted images outside of the workspace into your workspace. The markdown.copyFiles.destination Open in VS Code Open in VS Code Insiders setting controls where the new image file should be created. This setting maps globs that match on the current Markdown document to image destinations. The image destinations can also use some simple variables. See the markdown.copyFiles.destination Open in VS Code Open in VS Code Insiders setting description for information about the available variables.

For example, if you want every Markdown file under /docs in your workspace to put new media files into an images directory specific to the current file, you can write:

"markdown.copyFiles.destination": { "/docs/**/*": "images/${documentBaseName/(.).*/$1/}/" }

When a new file is pasted into /docs/api/readme.md, the image is now created under /docs/api/images/r/image.png.

Generating alt text for images

You can use AI to generate or update alt text for images in Markdown files. To generate alt text:

Make sure you have set up Copilot in your VS Code environment. You can get started with Copilot for free.
Open a Markdown file.
Put the cursor on an image link.
Select the Code Action (lightbulb) icon and select Generate alt text.
If you already have an alt text, select the Code Action, and select Refine alt text.

Smart selection

Smart selection lets you quickly expand and shrink selection in Markdown documents. This can be used to quickly select entire block elements (such as code blocks or tables) and to select the entire contents of a header section in the Markdown file.

Smart selection uses the following commands:

Expand: ⌃⇧⌘→ (Windows, Linux Shift+Alt+Right)
Shrink: ⌃⇧⌘← (Windows, Linux Shift+Alt+Left)

Selection applies to the following, and follows a traditional hierarchical pattern:

Headers
Lists
Block quotes
Fenced code blocks
Html code blocks
Paragraphs

Link validation

Link validation checks local links in your Markdown code to make sure they are valid. This can catch common mistakes, such linking to a header that was renamed or to a file that no longer exists on disk.

Link validation is off by default. To enable it, set "markdown.validate.enabled": true. VS Code then analyzes Markdown links to headers, images, and other local files. Invalid links are reported as either warnings or errors. All link validation happens locally and there is no checking of external http(s) links.

There are a few settings you can use to customize link validation:

markdown.validate.fileLinks.enabled Open in VS Code Open in VS Code Insiders - Enable/disable validation of links to local files: [link](/path/to/file.md)
markdown.validate.fragmentLinks.enabled Open in VS Code Open in VS Code Insiders - Enable/disable validation of links to headers in the current file: [link](#_some-header)
markdown.validate.fileLinks.markdownFragmentLinks Open in VS Code Open in VS Code Insiders - Enabled/disable validation of links to headers in the other markdown file: [link](other-file.md#some-header)
markdown.validate.referenceLinks.enabled Open in VS Code Open in VS Code Insiders - Enable/disable validation of reference links: [link][ref].
markdown.validate.ignoredLinks Open in VS Code Open in VS Code Insiders - A list of link globs that skip validation. This is useful if you link to files that don't exist on disk but do exist once the Markdown is published.

Find All References to headers and links

Use the Find All References (⇧⌥F12 (Windows, Linux Shift+Alt+F12)) command to find all locations in the current workspace where a Markdown header or link is referenced:

Find All References is supported for:

Headers: # My Header. Shows all links to #my-header.
External links: [text](http://example.com). Shows all links to http://example.com.
Internal links: [text](./path/to/file.md). Shows all links to ./path/to/file.md
Fragments in links: [text](./path/to/file.md#my-header). Shows all links to #my-header in ./path/to/file.md

Rename headers and links

Tired of accidentally breaking links when you change a Markdown header? Try using Rename Symbol (F2) instead. After you type the new header name and press Enter, VS Code updates the header and automatically updates all links to that header:

You can also use F2 on:

Headers: # My Header. This updates all links to #my-header.
External links: [text](http://example.com/page). This updates all places that linked to http://example.com/page
Internal links: [text](./path/to/file.md). This renames the file ./path/to/file.md and also updates all links to it.
Fragments in links: [text](./path/to/file.md#my-header). This renames the header in ./path/to/file.md and also updates all links to it.

Automatic link updates on file move or rename

With automatic Markdown link updating, VS Code will automatically update Markdown links whenever a linked to file is moved or renamed. You can enable this feature with the markdown.updateLinksOnFileMove.enabled Open in VS Code Open in VS Code Insiders setting. Valid setting values are:

never (the default) — Don't try to update links automatically.
prompt — Confirm before updating links.
always — Update links automatically without confirmation.

Automatic link updating detects renames of Markdown files, images, and directories. You can enable it for additional file types with markdown.updateLinksOnFileMove.include Open in VS Code Open in VS Code Insiders .

Markdown preview

VS Code supports Markdown files out of the box. You just start writing Markdown text, save the file with the .md extension and then you can toggle the visualization of the editor between the code and the preview of the Markdown file; obviously, you can also open an existing Markdown file and start working with it. To switch between views, press ⇧⌘V (Windows, Linux Ctrl+Shift+V) in the editor. You can view the preview side-by-side (⌘K V (Windows, Linux Ctrl+K V)) with the file you are editing and see changes reflected in real-time as you edit.

Here is an example with a simple file.

Tip: You can also right-click on the editor Tab and select Open Preview (⇧⌘V (Windows, Linux Ctrl+Shift+V)) or use the Command Palette (⇧⌘P (Windows, Linux Ctrl+Shift+P)) to run the Markdown: Open Preview to the Side command (⌘K V (Windows, Linux Ctrl+K V)).

Dynamic previews and preview locking

By default, Markdown previews automatically update to preview the currently active Markdown file:

You can lock a Markdown preview using the Markdown: Toggle Preview Locking command to keep it locked to its current Markdown document. Locked previews are indicated by [Preview] in the title:

Note: The Markdown: Toggle Preview Locking command is available only if Markdown preview is the active Tab.

Editor and preview synchronization

VS Code automatically synchronizes the Markdown editor and the preview panes. Scroll the Markdown preview and the editor is scrolled to match the preview's viewport. Scroll the Markdown editor and the preview is scrolled to match its viewport:

You can disable scroll synchronization using the markdown.preview.scrollPreviewWithEditor Open in VS Code Open in VS Code Insiders and markdown.preview.scrollEditorWithPreview Open in VS Code Open in VS Code Insiders settings.

The currently selected line in the editor is indicated in the Markdown preview by a light gray bar in the left margin:

Additionally, double clicking an element in the Markdown preview will automatically open the editor for the file and scroll to the line nearest the clicked element.

Markdown preview in diff view

The Markdown preview can also render diffs, showing the rendered document with changes highlighted instead of the raw Markdown source.

This behavior is opt-in. You can switch a single diff to the preview, or change the default editor used for Markdown diffs.

Open a single diff in the Markdown preview

To switch an open Markdown diff (for example, a file opened from the Source Control view) to the rendered preview:

With the diff editor active, run View: Reopen Editor With... from the Command Palette (⇧⌘P (Windows, Linux Ctrl+Shift+P)).
Select Markdown Preview.

To switch back, run View: Reopen Editor With... again and select the default text editor.

Set the Markdown preview as the default editor

To make the Markdown preview the default editor for all .md files, including diffs, configure the workbench.editorAssociations Open in VS Code Open in VS Code Insiders setting:

"workbench.diffEditorAssociations": { "*.md": "vscode.markdown.preview.editor" }

workbench.diffEditorAssociations takes precedence over workbench.editorAssociations for diff views. You can combine the two settings to make the preview the default for normal file opens while keeping diffs in the text editor:

Inline math: $x^2$

You can create a math equation block with double dollar signs:

// Place your settings in this file to overwrite default and user settings. { "markdown.styles": ["Style.css"] }

Keep trailing whitespace in order to create line breaks

To create hard line breaks, Markdown requires two or more spaces at the end of a line. Depending on your user or workspace settings, VS Code might be configured to remove trailing whitespace. In order to keep trailing whitespace in Markdown files only, you can add these lines to your settings.json: