how to change Visual Studio Code environment font

Question

Is there a way to change the environment font size in Visual Studio Code? stuff like intellisense box, debug panel, file names ..etc.

I know how to change the editor's font size but I couldn't find how to change the environment font size so I wonder if you can change it somehow

Answer 1

According to the changelog of version 1.2, new commands were added to zoom in and out only the font but the entire UI.

Changelog: https://code.visualstudio.com/updates/v1_24#_font-zoom-commands

Use the following keybindings to replace the default global zoom actions:

on macOS:

{ "key": "cmd+numpad_add",      "command": "editor.action.fontZoomIn" },
{ "key": "shift+cmd+=",         "command": "editor.action.fontZoomIn" },
{ "key": "cmd+=",               "command": "editor.action.fontZoomIn" },
{ "key": "cmd+numpad_subtract", "command": "editor.action.fontZoomOut" },
{ "key": "shift+cmd+-",         "command": "editor.action.fontZoomOut" },
{ "key": "cmd+-",               "command": "editor.action.fontZoomOut" },
{ "key": "cmd+numpad0",         "command": "editor.action.fontZoomReset" },
{ "key": "cmd+0",               "command": "editor.action.fontZoomReset" },

on Windows and Linux:

{ "key": "ctrl+numpad_add",      "command": "editor.action.fontZoomIn" },
{ "key": "shift+ctrl+=",         "command": "editor.action.fontZoomIn" },
{ "key": "ctrl+=",               "command": "editor.action.fontZoomIn" },
{ "key": "ctrl+numpad_subtract", "command": "editor.action.fontZoomOut" },
{ "key": "shift+ctrl+-",         "command": "editor.action.fontZoomOut" },
{ "key": "ctrl+-",               "command": "editor.action.fontZoomOut" },
{ "key": "ctrl+numpad0",         "command": "editor.action.fontZoomReset" },
{ "key": "ctrl+0",               "command": "editor.action.fontZoomReset" },

Answer 2

A Simple approach to change the Font Size in Visual Studio Work Environment :

Go To : File -> Preferences -> Settings OR Press CTRL+, i.e. CTRL + COMMA.

This will open settings.json.

You can see 3 tabs there :

1. User Settings
2. Workspace Settings
3. Folder Settings

Go to User Settings and Add this :

{
"editor.fontSize": 16
}

Now just save and close the file.

In above code, 16 represents the font size. Increase of Decrease as per your wish.

Answer 3

Try playing around with a combination of the following user settings:

{
  "editor.fontSize": 18,
  "window.zoomLevel": 1.5,
}

Answer 4

Currently it is not possible to change the font family or size outside the editor. You can however zoom the entire user interface in and out from the View menu.

Update for our VS Code 1.0 release:

A newly introduced setting window.zoomLevel allows to persist the zoom level for good! It can have both negative and positive values to zoom in or out.

Answer 5

In Visual Studio Code, by pressing Ctrl+ and Ctrl- you can change the overall font size of the IDE. This helps faster than changing settings in every session. Hope it helps...

Answer 6

After Pressing Control+Shift+P as suggested by @Edwin:

1. Look for Workspace Settings:

2. Then "Place your settings in the file to the right to overwrite...default and user settings," or click the UserSettings tab to adjust the window.zoomLevel if that is the desired action.