How to Change the Integrated Terminal Colors in VS Code

# Table of Contents

1. How to Change the Integrated Terminal Colors in VS Code
2. Changing the terminal colors for a specific theme
3. Changing the terminal colors by changing your theme

# How to Change the Integrated Terminal Colors in VS Code

To change the integrated terminal colors in VS Code:

1. Press Ctrl + Shift + P (or Command + Shift + P on macOS).

2. Type user settings and select Preferences: Open User Settings.

You can also open the settings screen by pressing Ctrl + , on Windows and Linux or Cmd + , on macOS.

3. Type workbench color customizations in the search field.

4. Click on the Edit in settings.json button under WorkBench: Color Customizations.

You can use the following format to change the color theme of your integrated terminal.

Copied!
"workbench.colorCustomizations": {
  "terminal.background": "#131212f4",
  "terminal.foreground": "#dddad6e7"
},

Make sure to remove the trailing comma if the property comes last.

The terminal.background property sets the background color of the terminal.

The terminal.foreground property sets the text color.

The color can be set using the following formats:

• #RGB
• #RGBA
• #RRGGBB
• #RRGGBBAA

Once you set the property to a specific color, you can hover over the color and use the color picker.

If you need to change the color of the cursor in the terminal, use the terminalCursor.foreground property.

Copied!
"workbench.colorCustomizations": {
  "terminal.background": "#0f0e0ef4",
  "terminal.foreground": "#dddad6e7",
  "terminalCursor.foreground": "#f1d755e7"
},

If you need more fine-grained control over the colors in the terminal, set the ansi* properties.

Copied!
"workbench.colorCustomizations": {
  "terminal.background": "#131212f4",
  "terminal.foreground": "#dddad6e7",
  "terminal.ansiBlack": "#1d2021f3",
  "terminal.ansiBrightBlack": "#665c54e3",
  "terminal.ansiBrightBlue": "#0d6678ef",
  "terminal.ansiBrightCyan": "#8ba59bec",
  "terminal.ansiBrightGreen": "#237e02ee",
  "terminal.ansiBrightMagenta": "#8f4673ee",
  "terminal.ansiBrightRed": "#fb553ff2",
  "terminal.ansiBrightWhite": "#fdf4c1ed",
  "terminal.ansiBrightYellow": "#fac13bed",
  "terminal.ansiBlue": "#00a2f9f1",
  "terminal.ansiCyan": "#8ba59bf8",
  "terminal.ansiGreen": "#95c085f2",
  "terminal.ansiMagenta": "#8f4673ec",
  "terminal.ansiRed": "#fb553ff5",
  "terminal.ansiWhite": "#a89984f4",
  "terminal.ansiYellow": "#fac13bf1"
}

The terminal.ansi* properties can be used to set the different shades of all colors in the terminal.

# Changing the terminal colors for a specific theme

If you only want to change the terminal colors for a specific theme, specify the theme between a set of square brackets.

Copied!
"workbench.colorCustomizations": {
  "[Monokai]": {
    "terminal.background": "#0f0e0ef4",
    "terminal.foreground": "#dddad6e7"
  }
},

The terminal color customizations above only apply to the Monokai theme.

You can specify any of the aforementioned properties in the theme-specific object to customize the terminal colors.

# Changing the terminal colors by changing your theme

An alternative approach is to change your theme to change your terminal colors.

1. Press:

• Ctrl + Shift + P on Windows and Linux.
• Command + Shift + P on macOS.

2. Type preferences color theme and select the command.

3. Use the arrow keys to navigate and pick a theme you like.

After you click on the Preferences: Color Theme command, you can also select Browse Additional Color Themes to get a wider range of custom themes.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

• How to change the Color of Comments in Visual Studio Code
• Change the Cursor color, style and animation in VS Code
• How to use the Color Picker in Visual Studio Code
• VS Code: Disable colorized Brackets or change Bracket color
• How to change the Color of Comments in Visual Studio Code