In this article, we’ll go over some of the most useful Visual Studio Code shortcuts that will save you time and supercharge your development when using Visual Studio Code. This article covers default keyboard shortcuts for Windows, Linux and macOS.
Visual Studio Code (VS Code) is one of the most popular and most used code editors. It’s open source and free to use. It also provides support for many languages and frameworks, whether through built-in features or the extensive list of extensions available for the editor.
Please note that these Visual Studio Code shortcuts are taken from VS Code’s documentation. If some shortcuts don’t work, it could be due to changes in shortcuts in your editor or file format, or sometimes due to extensions installed.
Easy VS Code Navigation Shortcuts
This section presents all the Visual Studio Code shortcuts that allow you to navigate different parts of the editor.
Open a file
Searching for a specific file, especially as the project gets larger, can chew up a lot of time. Even if you already know where the file is, it’s definitely handy to learn this keyboard shortcut to easily open files in your project.
- Windows/Linux: ctrl + P
- macOS: command + P
Open settings
Visual Studio Code comes with a lot of features and settings that you can change to fit your needs. This keyboard shortcut makes it easier to get to the settings whenever necessary.
- Windows/Linux: ctrl + ,
- macOS: command + ,
Toggle sidebar
A lot of times you need more space for the open file you’re working on. So, this keyboard shortcut is handy to show or hide the sidebar whenever necessary.
- Windows/Linux: ctrl + B
- macOS: command + B
Navigate tabs
When you have a lot of tabs open and you need to move between them, one easy way to do it is with this keyboard shortcut, which shows you the list of the tabs and lets you navigate between them and choose which one you want to open.
- Windows/Linux: ctrl + shift + tab
- macOS: control + shift + tab
Keep pressing tab to switch between tabs.
Navigate tab groups
One of the nice features that Visual Studio Code provides is creating tab groups. Tab groups allow you to split up your tabs into groups, and each editor group takes a part of the screen.
This keyboard shortcut makes it easier and faster to navigate between groups in the editor group history. This shortcut also allows you to create a new group if the editor group you select in the shortcut is higher than the number of groups currently open.
- Windows/Linux: ctrl + 1 or 2 or 3
- macOS: command + 1 or 2 or 3
Open the terminal
During your development, you’ll most likely be using the terminal a lot. Visual Studio Code allows you to open a terminal window right inside the editor. This saves you from moving between the editor and the terminal and allows you to completely focus on the editor and the code.
- Windows/Linux: ctrl + J
- macOS: command + J
Open the command palette
There are lots of commands you can execute in Visual Studio Code. These commands can be related to out-of-the-box features or extension features.
With this keyboard shortcut, you can easily open the command palette. The command palette allows you to search through the commands you can use and execute them.
- Windows/Linux: ctrl + shift + P
- macOS: command + shift + P
Quick Selections
During development, you’ll most probably need to make selections in your code, whether for copying, cutting, or other purposes.
Instead of doing so with your machine’s mouse, doing it with the keyboard saves you time. These keyboard shortcuts focus on making selections quickly.
Select current line
A lot of times you need to select the entire current line your cursor is at. This keyboard shortcut makes it very simple.
- Windows/Linux: ctrl + L
- macOS: command + L
Similar occurrences
How many times do you need to rename a variable, or simply change a certain repeated text or phrase throughout the entire file you’re working with?
Two keyboard shortcuts can be used in a situation similar to this. The first requires you to already have the word or phrases selected, while the other doesn’t.
Current selection
With this keyboard shortcut, all you need is to have one occurrence of the text you’re looking for in the file selected. Then, by pressing the keys of the shortcut, you’ll select all its occurrences in the file.
- Windows/Linux: ctrl + shift + L
- macOS: command + shift + L
Current word
This keyboard shortcut allows you to do the same as the previous one, but without having anything selected. While the cursor is placed on a word, you can press the keys of this shortcut and the current word with all of its occurrences in the current file will be selected.
- Windows/Linux: ctrl + F2
- macOS: command + F2
Note: on macOS, make sure to press fn at the same time as F2.
Select until the end of the word
When selecting a certain part of the code, you can easily move and expand the selection with this shortcut. You can use the right arrow or the left arrow to go in the direction you want.
- Windows/Linux: shift + alt + → or ←
- macOS: shift + option + → or ←
Multiple Selections
Mastering these keyboard shortcuts will boost your development speed and makes you a coding hero. These keyboard shortcuts allow you to select across multiple lines to make necessary modifications or additions.
This saves you from repeating yourself and saves you the additional time you’d spend doing the same operation across multiple lines.
Select a column or box of code by dragging the mouse
Dragging your cursor across lines of code or text selects each line from end to end. But you can also select a group of lines only partially with this shortcut. Multiple lines will be selected, but only as much of them as you drag over.
- Windows/Linux: shift + alt + drag mouse across the lines
- macOS: shift + option + drag mouse across the lines
Select a column or box of code with arrow keys
You can do the same as above but without using your mouse. Instead of dragging a mouse, you use they keyboard arrow keys.
- Windows/Linux: ctrl + shift + alt + → or ← or ↓ or ↑
- macOS: command + shift + option + → or ← or ↓ or ↑
How to Use Find Results
All editors, even simple editors, should have a find feature so that you can find certain words, like function or variable names, phrases, or blocks of code either in the current selected file or across multiple files.
This section will go over keyboard shortcuts that will allow us to make the best out of the results of using the find feature in Visual Studio Code.
Navigate results
You can use this keyboard shortcut to move between find results in the active file.
- Windows/Linux/macOS: F3
Note: on macOS, make sure to press fn at the same time as F3.
Select multiple results
If you’re using the find feature to find certain bits of text so that you can modify a subset of these results, you can use this shortcut to navigate and select the find results in the active file.
- Windows/Linux: ctrl + D
- macOS: command + D
Select all results
If you’re using the find feature to do certain modifications with all the find results, this keyboard shortcut allows you to select all the find results.
- Windows/Linux: alt + enter
- macOS: option + enter
Code Navigation
As each file or project grows, it becomes harder to find certain parts of the code. Finding errors or going to the code at a certain line can be hard when doing it manually.
These keyboard shortcuts save you the hassle and allow you to invest your time in what you actually want to do.
Go to line
Finding code at a certain line is especially helpful when you get a compile or runtime error that specifies what line of code caused it. This keyboard shortcut eliminates the need to actually find the line yourself.
- Windows/Linux: ctrl + G
- macOS: control + G
Go to matching bracket
You’ll often find yourself needing to find the matching closing bracket of a block. This is especially true when the files grow with time. This keyboard shortcut allows you to easily find the closing matching bracket of the current block. In HTML tags, it allows you to move to the end of the current tag.
- Windows/Linux: ctrl + shift + \
- macOS: command + shift + \
Fold/unfold Block
When reading a file with a lot of lines or data, it’s easier to fold (hide) an entire block that you’re not currently focusing on so you can focus on something else. This keyboard shortcut allows you to fold or unfold a block. Click anywhere in the block and then hit the following keys.
- Windows/Linux: ctrl + shift + [ or ]
- macOS: command + option + [ or ]
Fold/unfold blocks and sub-blocks
What if the block contains sub-blocks? Using the above command will fold the parent, but when the parent is unfolded the sub-blocks will have been unchanged. If you need to fold and unfold a block and its sub-blocks, you can do it with this keyboard shortcut.
- Windows/Linux: ctrl + K + [ or ]
- macOS: command + K + [ or ]
Navigate errors and warnings
Finding errors and warnings in your code is essential. Sometimes some errors are not easy to find — such as when a line doesn’t end with ; as it should. This keyboard shortcut saves you the hassle of scrolling or thoroughly looking through the line to find the exact problem. It allows you to move to the next error or warning.
- Windows/Linux/macOS: F8
Note: on macOS, make sure to press fn at the same time as F8.
Moving the Cursor
In a lot of cases, you might need to have multiple cursors, each at a different position in the file. These keyboard shortcuts help to make it easier to move around with multiple cursors.
Insert additional cursors
There are two ways to insert an additional cursor into the file: either at a specific position, or above/below the current line the cursor is at.
1. At position
This keyboard shortcut allows you to insert an additional cursor at any point in the file.
- Windows/Linux: alt + mouse click at the position
- macOS: option + mouse click at the position
2. Above or below
The second way you can insert a cursor is to insert it above or below each of the current cursor positions.
- Windows/Linux: ctrl + alt + ↓ or ↑
- macOS: command + option + ↓ or ↑
Undo cursor insert
What if you inserted a cursor by mistake, or realized later that you don’t want to insert the cursor at that position anymore? This keyboard shortcut allows you to undo the last cursor insert. This is very helpful when you’ve inserted multiple cursors, as it allows you to keep the others in place and just removes the last inserted one.
- Windows/Linux: ctrl + U
- macOS: command + U
Insert the cursor at the end of a highlighted selection
Another keyboard shortcut that makes your development faster is to insert the cursor at the end of a highlighted selection.
- Windows/Linux: shift + alt + I
- macOS: shift + option + I
Faster Coding
In this section, we’ll go through Visual Studio Code shortcuts that will make certain operations related to your code easier and quicker.
Move lines and blocks
A lot of times you might need to move a line from one position to another. Instead of copying or cutting and pasting the line into another position, this shortcut offers a faster solution. Just place the cursor on the line.
- Windows/Linux: alt + ↓ or ↑
- macOS: option + ↓ or ↑
This will also move a whole paragraph of text that the cursor is active in. If you want to move a block of code, simply highlight that code before pressing the shortcut above.
Copy lines and blocks
What if you need to copy a line and paste it below or above?
Instead of having to actually copy and paste the line, this shortcut duplicates the line either below or above it, based on the direction chosen with the arrows.
- Windows/Linux: shift + alt + ↓ or ↑
- macOS: shift + option + ↓ or ↑
To move a block of text or code in the same way, highlight it first and then use this shortcut.
Indent/outdent lines
As you copy lines from one place or file to another, or as you make changes to the code, a lot of times the code will end up wrongly indented. This shortcut allows you to easily indent or outdent lines as necessary. Select multiple lines to move them all together.
- Windows/Linux: ctrl + [ or ]
- macOS: command + [ or ]
Toggle comments
In a lot of cases, you might need to comment or uncomment a line. This can be easily done with this shortcut. This works for both line and block comments.
Line Comments
Click on the line you want to comment out. (If you highlight a block of code, this command will comment out each line individually.)
- Windows/Linux: ctrl + /
- macOS: command + /
Block Comments
Unlike the above shortcut, the following shortcut will comment out the code you highlight as a single comment.
- Windows/Linux: shift + alt + A
- macOS: shift + option + A
Code formatting
It’s essential to keep your code and files formatted for readability reasons. Visual Studio Code provides two shortcut commands for code formatting.
File
This shortcut allows you to format the entire file.
- Windows/Linux: ctrl + shift + F
- macOS: option + shift + F
Selection
This shortcut allows you to format just the selected set of lines in a file.
- Windows/Linux: ctrl + K, then ctrl + F
- macOS: command + K, then command + F
Quick fix
In a lot of cases when there’s an error, Visual Studio Code can resolve it if it’s a common or simple mistake — for example, if a semicolon ; is missing. This shortcut allows you to apply the quick fix to any error or warning if the quick fix is available for it.
- Windows/Linux: ctrl + .
- macOS: command + .
Renaming
Renaming a variable, function, or class that’s used multiple times can be prone to errors if done manually. You might miss a usage of it whether in the current file or a different file. This shortcut gives you a safe way to rename any symbol.
- Windows/Linux/macOS: F2
Note: on macOS, make sure to press fn at the same time as F2.
Trim white spaces
Why manually trim white spaces from the end of a line when you can just do it with this shortcut?
- Windows/Linux: ctrl + K + X
- macOS: command + K + X
Note: holding ctrl or command throughout, press K first, then X separately.
Change programming language
By default, Visual Studio Code detects the current programming language of the file you’re working on. Usually, it’s done by checking the extension of the file.
However, sometimes it doesn’t correctly detect the language if the extension of the file isn’t supported.
For that reason or any other reason, if you need to change the programming language of a file you can use this shortcut.
- Windows/Linux: ctrl + K, then M
- macOS: command + K, then M
Run code
One cool VS Code feature is the option to run code right in the editor. This depends on the language, framework, or the kind of task you need to run. For example, you can set up debugging for Javascript projects. However, if you have a debugger or task runner configured, you can use this shortcut to run code in VS Code.
- Windows/Linux/macOS: F5
Note: on macOS, make sure to press fn at the same time as F5.
Better Coding
These keyboard shortcuts revolve around understanding the code that we’re working with to produce better code.
To write good quality code, we need to understand the functions, classes, or methods we’re using.
Sometimes, we resort to googling a function to see its definition or signature. However, this might end up wasting our time or it might not apply to the code we’ve created.
Check definition
It’s essential to understand the definition of the code we’re using before actually using it. These Visual Studio Code shortcuts allow us to see their definition and documentation easily from the editor.
Go to definition
This shortcut takes us to the file or line where the part of code is initially defined.
- Windows/Linux/macOS: F12
Note: on macOS, make sure to press fn at the same time as F12.
Peek definition
This shortcut allows us to open definition and documentation in the same place we’re checking the definition. This makes it easier to see the definition without the need to move to another file or line.
- Windows/Linux: alt + F12
- macOS: option + F12
Note: on macOS, make sure to press fn at the same time as F12.
Toggle suggestions
While writing our code, VS Code or some of the extensions we’ll have installed will show us suggestions for our code. This shortcut allows us to toggle the suggestions to see or hide them.
- Windows/Linux: ctrl + I
- macOS: command + I
Show a function’s signature
This is very common with most, if not all developers. We tend to forget functions’ signatures, even when they’re functions that we use a lot. With this shortcut, you can easily see parameter hints for the function. With the parameter hints, you can check what parameters you need to pass to the function.
- Windows/Linux: ctrl + shift + spacebar
- macOS: command + shift + spacebar
Zen mode
Although this is not related to understanding the code and definitions, this shortcut is useful if you need to be completely focused on your code. With this shortcut, you can enable Zen mode, which will change the display to be completely focused on the currently open file.
- Windows/Linux: ctrl + K, then Z
- macOS: command + K, then Z
Press the same keyboard shortcut to return to the normal editor view.
Conclusion
VS Code is one of the best code/text editors for developers at the moment. It provides a lot of out-of-the-box features as well as an extension marketplace that allows developers to easily contribute and provide extensions for the community.
Keyboard shortcuts make development in VS Code even easier and allow you to focus on building good-quality projects in less time.
In this article, we’ve covered some useful Visual Studio Code shortcuts that are guaranteed to make your development faster.
VS Code still has a wider set of keyboard shortcuts to do more. Here are links for checking out the whole set of default keyboard shortcuts for your OS:
FAQs About VS Code Shortcuts
How do I see all shortcuts in VS Code?
To view all available keyboard shortcuts in Visual Studio Code (VS Code), you can access the Keyboard Shortcuts view by pressing Ctrl + K followed by Ctrl + S on Windows/Linux or Cmd + K followed by Cmd + S on macOS. Alternatively, you can click the gear icon (⚙️) in the bottom left corner of the VS Code window and select “Keyboard Shortcuts.” This view displays a list of all default shortcuts, and you can search for specific commands, filter by categories, and even customize or reset shortcuts to your preferences. It’s a handy reference for improving your efficiency and workflow in VS Code.
What does Ctrl P do in VS Code?
In Visual Studio Code (VS Code), pressing Ctrl + P (or Cmd + P on macOS) opens the “Quick Open” feature. This feature allows you to quickly search for and open files, as well as navigate to symbols and other items within your project.
When you press Ctrl + P, a small input box appears at the top of the editor. You can start typing the name of the file or item you want to open or navigate to. As you type, VS Code will display matching results in real-time. You can use the arrow keys to select from the list of results, and then press Enter to open the selected file or item.
The “Quick Open” feature in VS Code is a powerful way to navigate and work with your project’s files and symbols efficiently, especially in large and complex codebases. It’s a time-saving keyboard shortcut that many developers use frequently.
What does Ctrl Shift L do in VS Code?
In Visual Studio Code (VS Code), pressing Ctrl + Shift + L (or Cmd + Shift + L on macOS) is a keyboard shortcut used to select all occurrences of the currently selected word or text within the active file. This feature is called “Select All Occurrences.” This can be particularly helpful when you want to quickly find and edit all instances of a variable, function, or any other text within a file. It allows for efficient and consistent changes across multiple occurrences without manually selecting each one.
What does F12 do in VS Code?
In Visual Studio Code (VS Code), pressing the F12 key is a keyboard shortcut used to trigger the “Go to Definition” action. When you place your cursor on a symbol (e.g., a variable, function, class, or method) within your code and press F12, VS Code will navigate you to the location where that symbol is defined or declared. This feature is incredibly useful for quickly understanding code, exploring libraries or frameworks, and navigating large codebases. It allows you to jump to the definition of a symbol without manually searching through your project’s files.
What does Ctrl Shift P do in Visual Studio Code?
In Visual Studio Code (VS Code), pressing Ctrl + Shift + P (or Cmd + Shift + P on macOS) opens the “Command Palette.” The Command Palette is a powerful feature that allows you to search for and execute various commands and actions within VS Code. The Command Palette is a quick and efficient way to access and execute various features, settings, and extensions within VS Code without having to memorize all the available keyboard shortcuts. You can use it to open files, switch between open files, configure settings, install extensions, and perform many other tasks.
Shahed NasserI am a full-stack developer passionate about learning something new every day, then sharing my knowledge with the community.
