Damien Leroux
Damien Leroux

Reputation: 11693

How to indent/format a selection of code in Visual Studio Code?

I want to indent a specific section of code in Visual Studio Code.

I read How do you format code in Visual Studio Code? that gives shortcuts to indent the whole code, but it doesn't work when selecting a specific section of code.

I tried Ctrl + Shift + F after selecting some line in my code, but the whole file is indented. I'm on Windows with Visual Studio Code Insider 1.8.0. How can I do it?

Upvotes: 274

Views: 716880

Answers (18)

KcH
KcH

Reputation: 3502

I would usually do, select the code you want to format, right click and choose the format selection option, it usually formats entire page, just copy the formatted selection and undo (ctrl + z) to bring back to normal and paste the formatted ones replacing the selected ones ๐Ÿ˜

Upvotes: 0

Layonn Alves
Layonn Alves

Reputation: 11

You can select text and press TAB to indent it. You can also put your cursor on the begin of the line and hold CTRL + ALT and press up or down arrow to select multlines and when you selected the desired text you can press TAB

Upvotes: 1

Shaun Luttin
Shaun Luttin

Reputation: 141722

I want to indent a specific section of code in Visual Studio Code:

  • Select the lines you want to indent.
  • Use Ctrl + ] to indent them.

If you want to format a section (instead of indenting it):

  • Select the lines you want to format.
  • Use Ctrl + K, Ctrl + F to format them.

Upvotes: 424

Mohamed Allal
Mohamed Allal

Reputation: 20950

  • You can also indent a whole section (multi-lines) by selecting it and clicking TAB
  • and also indent backward using Shift+TAB

And of course for auto indentation and formatting, following the language you're using, you can see which good extensions do the good job, and which formatters to install or which parameters settings to enable or set. For each language and its available tools. Just make sure to read well the documentation of the extension, to install and set all what it needs. Exemple: prettier is the most common used formatter for JavaScript and typescript. And it's widely used by all projects and code style requirements and setup. And in CI pipelines.

Up to now the indentation problem bothers me with Python when copy pasting a block of code. If that's the case, here is how you solve that: Visual Studio Code indentation for Python

Upvotes: 256

Mangala Karunarathne
Mangala Karunarathne

Reputation: 319

This is the way I had my code before formatting... enter image description here

Then I used the command like this... (Make sure to select the code part that you need to format)

Shift+ Alt+F

And I got the formatted code like this....

enter image description here

Upvotes: 3

auspicious99
auspicious99

Reputation: 4331

(This works at least up to version 1.74.2, checked in Jan 2023)


On macOS Visual Studio Code version 1.36.1 (2019)

Visual Studio Code version 1.36.1 (2019)

To auto-format the selection, use โŒ˜K โŒ˜F (the trick is that this is to be done in sequence, โŒ˜K first, followed by โŒ˜F).

Auto-format selection or document

To just indent (shift right) without auto-formatting, use โŒ˜]

Indent options

As in Keyboard Shortcuts (โŒ˜K โŒ˜S, or from the menu as shown below)

Keyboard shortcuts

Upvotes: 11

Benjamin Ronneling
Benjamin Ronneling

Reputation: 821

On linux ubuntu: select text then ctrl + shift + i

Upvotes: 3

Chandranshu Gautam
Chandranshu Gautam

Reputation: 83

Many of the answers were not able to solve my problem too.

Just go for fn+tab

Welcome in advance.

Upvotes: 0

Hari Bhaskar
Hari Bhaskar

Reputation: 29

On windows its "Ctrl+[" and "Ctrl+]" for indent and unindent You can find rest of the shortcuts here

For mac, you can find the shortcuts here: https://code.visualstudio.com/docs/getstarted/keybindings

Upvotes: 2

rboy
rboy

Reputation: 2165

As you've seen there are two ways to indent the code (this for Windows).

  1. Reindenting the entire file

    Shift+Alt+F


  1. Reindenting only selected lines

    First set the shortcut for Reindent Selected Lines

    Menu File โ†’ Preferences โ†’ Keyboard Shortcuts โ†’ In the Search in keybindings type in Reindent Selected Lines โ†’ Select it and press Enter โ†’ Type in your own shortcut, e.g. Shift + 5, followed by Enter

    Now select your code lines in the editor and use the shortcut set above, e.g. Shift + 5, to automatically indent those lines only.

Upvotes: 7

Jose Guijarro
Jose Guijarro

Reputation: 31

Windows - 2022

Shift+Alt+F

Upvotes: 2

Meshu Deb Nath
Meshu Deb Nath

Reputation: 141

Crtl + Alt + F can also formate (windows)

Upvotes: 0

Andrew Smith
Andrew Smith

Reputation: 621

For me, using a mac in 2022 it was CMD + ] to indent multiple lines after selecting the desired indented lines.

Upvotes: 0

Marten Schlüter
Marten Schlüter

Reputation: 96

For German keyboard layout, the standard settings are:

  • Indent selection: Strg + ยด
  • Outdent selection: Strg + รŸ

Upvotes: 4

cladelpino
cladelpino

Reputation: 338

For me on windows it was Ctrl+ยก , indent line. It adds a tab at the beggining of each line.

Upvotes: 1

nevrast
nevrast

Reputation: 51

F1 → open Keyboard Shortcuts → search for 'Indent Line', and change keybinding to Tab.

Right click > "Change when expression" to editorHasSelection && editorTextFocus && !editorReadonly

It will allow you to indent line when something in that line is selected (multiple lines still work).

Upvotes: 5

ooXei1sh
ooXei1sh

Reputation: 3559

This should be able to set to whatever keybindings you want for indent/outdent here:

Menu FilePreferencesKeyboard Shortcuts

editor.action.indentLines

editor.action.outdentLines

Upvotes: 14

Adrian Romero
Adrian Romero

Reputation: 597

On OS X, choose "Document Format", and select all lines that you need format.

Then Option + Shift + F.

Upvotes: 27

Related Questions