CODEWITHSUNDEEP
visual-studio-codefontsfont-size
Francesco Cariaggi
Francesco Cariaggi

Reputation: 848

Visual Studio Code: change debug panel's font size and font family and debug console input as well

Is there a way to change the debug panel's font size and appearance in VS Code? I'm referring to the side panel where variables and their values are showed when debugging a program. Note that I want to change only its font size, not that of the entire editor.

I've come across other similar questions here in Stack Overflow, but the solutions provided required to change the zoom level of the entire editor (and thus of the debug panel too), then adjust the editor's font size. However, as I mentioned before, that's not what I'm looking for. I've searched through the settings but couldn't find anything at all. To me, it seems like a very basic feature for a text editor to have, so I can't believe there's no way to do that.

I'm using VS Code 1.40.1 on Linux

Upvotes: 20

Views: 13575

Answers (3)

J B
J B

Reputation: 440

I have 1.55.1 on Linux and still don't see an option for font size in the debug variables panel (which, as originally asked, is not the debug console). So to adjust the font size in the debug variables panel independently, use the Zoom feature to adjust the entire VS code application, and then use the available font size settings for Editor, IntegratedTerminal and DebugConsole to unzoom those three back to the desired smaller fontsize.

Upvotes: 4

Mikko Haavisto
Mikko Haavisto

Reputation: 1611

  • Paste these into your settings.json file USER section and change values to your liking.
  • Note that there is no fontWeight for debug console, but you can state the weight in the fontFamily, like in the example below.
  • lineHeight seems to be 1/3 bigger than fontSize by default, so that might be a good value to start with.
"debug.console.fontFamily": "Cascadia Code Light",
"debug.console.fontSize": 15,
"debug.console.lineHeight": 21,

Upvotes: 15

Mark
Mark

Reputation: 182551

I would assume the ability to change the debug's views' font/fontSize is coming as part of the ability to move those views to the Panel (See VS Code move debug tab (left panel) to bottom).

Added:

debug.console.fontSize

debug.console.fontFamily

debug.console.lineHeight

Previously, the size didn't apply to the debug console input. To be fixed in v1.45, see https://github.com/microsoft/vscode/issues/90714 and https://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_45.md#notable-fixes.strong text

Upvotes: 11

Related Questions