# VS Code: How to Auto-Format Your Code

> Automatically format code in Visual Studio Code using the Format Document command, plus how to configure formatter-specific settings

**URL:** https://sentry.io/answers/format-code-in-visual-studio-code/

---

## The Problem

How do I make Visual Studio Code (VS Code) automatically format my code – i.e. normalize indentation, line breaks, and spacing?

## The Solution

Code formatting in VS Code can be invoked through keyboard shortcuts or the command palette. To format the contents of the current file, we can either use the shortcut `Shift+Alt+F` (`Shift+Option+F` on macOS) or bring up the command palette with `Ctrl+Shift+P` (`Command+Shift+P` on macOS) and then search for and execute "Format Document".

VS Code comes with [formatters for JavaScript, TypeScript, JSON, HTML, and CSS](https://code.visualstudio.com/docs/editor/codebasics#_formatting). Formatters for other languages, as well as alternative formatters for these languages, can be found in the VS Code Marketplace, which is accessible from the editor's Extensions pane.

Specific options for each formatter can be configured in the editor settings, which is accessible from **File -> Preferences -> Settings** or by entering "Settings" into the command palette. Formatting options will be available in the **Extensions** section, including options for built-in formatters. For example, we use the option **Brace Style** in **CSS Language Features > CSS** to choose whether CSS opening braces should be placed on the same line as rules (*collapse*) or on their own line (*expand*).

```css
body { /* collapse */
    font-family: serif;
}
```

```css
body
{ /* expand */
    font-family: serif;
}
```

---

*Source: [sentry.io/answers/format-code-in-visual-studio-code/](https://sentry.io/answers/format-code-in-visual-studio-code/)*
