VScode terminal not showing properly

Question

I am using the inbuilt VS code Terminal, but the theme and formatting are not what I expected.

This is what I got in VScode:

And I was expecting it to look exactly like iTerm2:

I tried the fix from the following link: Change default terminal app in Visual Studio Code on Mac , for I suspect the VScode is still using the default terminal:

But it did not fix the problem. For convenience, this is my setting.json file:

{
  "editor.minimap.enabled": false,
  "workbench.colorTheme": "Oceanic Next (dimmed bg)",
  "liveServer.settings.donotShowInfoMsg": true,
  "terminal.integrated.shell.osx": "/usr/local/bin/zsh",
  "terminal.external.osxExec": "iTerm.app",
  "editor.formatOnSave": true,
  "workbench.statusBar.visible": true,
  "workbench.activityBar.visible": true,
  "editor.wordWrap": "on",
  "editor.trimAutoWhitespace": false,
  "eslint.run": "onSave",
  "workbench.colorCustomizations": {
    "statusBar.background": "#333333",
    "statusBar.noFolderBackground": "#333333",
    "statusBar.debuggingBackground": "#263238"
  }
}

How can I find a fix?

score 0 · Accepted Answer · answered Jan 08 '23 at 11:58

Open Settings in Visual Studio Code.

On Mac: Click Code → Preferences → Settings or press ⌘ + ,.
On PC: Click File → Preferences → Settings or press Ctrl +,.

Enter terminal.integrated.fontFamily in the search box at the top of Settings tab and set the value below to MesloLGS NF.

VScode terminal not showing properly

1 Answers1