Skip to main content

Overview

The Visual Studio Code editor is built on the Monaco Editor, providing a fast, feature-rich editing experience optimized for coding. It includes intelligent code completion, syntax highlighting, bracket matching, and extensive customization options.

Key Features

Multi-Cursor Editing

Edit multiple locations in your code simultaneously for faster refactoring and editing.
1

Add Cursor Below

Press Ctrl+Alt+Down (Windows/Linux) or Cmd+Option+Down (macOS) to add a cursor on the line below
2

Add Cursor Above

Press Ctrl+Alt+Up (Windows/Linux) or Cmd+Option+Up (macOS) to add a cursor on the line above
3

Select All Occurrences

Press Ctrl+Shift+L (Windows/Linux) or Cmd+Shift+L (macOS) to select all occurrences of the current selection

Code Folding

Collapse and expand sections of code to focus on specific areas.
// Fold regions are automatically detected based on indentation
export class CompletionItem {
  readonly editStart: IPosition;
  readonly editInsertEnd: IPosition;
  readonly editReplaceEnd: IPosition;
  
  // Fold this section with Ctrl+Shift+[ (Cmd+Option+[ on macOS)
  constructor(
    readonly position: IPosition,
    readonly completion: languages.CompletionItem,
    readonly container: languages.CompletionList,
    readonly provider: languages.CompletionItemProvider
  ) {
    this.textLabel = typeof completion.label === 'string'
      ? completion.label
      : completion.label?.label;
  }
}

Bracket Matching and Colorization

Visually identify matching brackets with automatic highlighting and customizable bracket pair colorization.
Bracket pair colorization can be enabled in settings with "editor.bracketPairColorization.enabled": true

Editor Commands

Text Manipulation

The editor provides powerful text editing operations through the IEditOperationBuilder interface:
export interface IEditOperationBuilder {
  // Add a new edit operation (a replace operation)
  addEditOperation(range: IRange, text: string | null, forceMoveMarkers?: boolean): void;
  
  // Add a tracked edit operation for undo/redo
  addTrackedEditOperation(range: IRange, text: string | null, forceMoveMarkers?: boolean): void;
  
  // Track selection when applying edit operations
  trackSelection(selection: Selection, trackPreviousOnEmpty?: boolean): string;
}

Common Keyboard Shortcuts

ActionWindows/LinuxmacOS
Cut lineCtrl+XCmd+X
Copy lineCtrl+CCmd+C
Move line up/downAlt+Up/DownOption+Up/Down
Duplicate lineShift+Alt+DownShift+Option+Down
Delete lineCtrl+Shift+KCmd+Shift+K
Comment lineCtrl+/Cmd+/
Format documentShift+Alt+FShift+Option+F
Go to lineCtrl+GCmd+G
FindCtrl+FCmd+F
ReplaceCtrl+HCmd+Option+F

Configuration

Editor Settings

Configure the editor behavior in your settings.json:
{
  "editor.fontSize": 14,
  "editor.fontFamily": "'Fira Code', Consolas, 'Courier New', monospace",
  "editor.fontLigatures": true,
  "editor.lineHeight": 22,
  "editor.tabSize": 2,
  "editor.insertSpaces": true,
  "editor.wordWrap": "on",
  "editor.minimap.enabled": true,
  "editor.rulers": [80, 120],
  "editor.renderWhitespace": "boundary",
  "editor.cursorBlinking": "smooth",
  "editor.cursorSmoothCaretAnimation": "on",
  "editor.formatOnSave": true,
  "editor.formatOnPaste": true
}

Auto Save

Control when files are automatically saved:
{
  "files.autoSave": "off"
}

Language-Specific Settings

Override editor settings per language:
{
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true,
    "editor.tabSize": 2
  },
  "[python]": {
    "editor.tabSize": 4,
    "editor.insertSpaces": true
  },
  "[markdown]": {
    "editor.wordWrap": "on",
    "editor.quickSuggestions": false
  }
}

Accessibility Features

Screen Reader Support

VS Code provides full screen reader support with optimized navigation and announcements. Enable with Ctrl+E (Windows/Linux) or Cmd+E (macOS).
Use Alt+F1 to open the accessibility help dialog which shows all keyboard shortcuts for the current context.

Advanced Features

Sticky Scroll

Keep important context visible while scrolling through code:
{
  "editor.stickyScroll.enabled": true,
  "editor.stickyScroll.maxLineCount": 5
}

Linked Editing

Automatically update related symbols when editing:
{
  "editor.linkedEditing": true
}

Inlay Hints

Display additional inline information about types and parameters:
{
  "editor.inlayHints.enabled": "on",
  "typescript.inlayHints.parameterNames.enabled": "all",
  "typescript.inlayHints.variableTypes.enabled": true
}

Performance

For large files, VS Code automatically adjusts features to maintain performance:
Files over 50MB are opened in a special mode with limited features for optimal performance.
{
  "editor.largeFileOptimizations": true,
  "files.maxMemoryForLargeFilesMB": 4096
}

Build docs developers (and LLMs) love