Wanna see something cool? Check out Angular Spotify 🎧

How to change Visual Studio Code terminal font?

Problem

So, I had to reinstall my computer and set up the terminal all over again. Here’s what I typically need:

  • iTerm (That’s the one most of my gang use)
  • Oh My Zsh
  • powerlevel10k
  • zsh-syntax-highlighting
  • zsh-autosuggestions
  • fzf

I’ll give you a step-by-step on that soon. But for now, iTerm looks great.

iTerm

But not VSCode’s terminal.

VSCode

Solution

Step 1. Open settings.json in VSCode

Hit Command ⌘ + Shift ⇧ + P in VSCode, type settings and select Preferences: Open User Settings (JSON)

VSCode Preference

Step 2. Add this code into sertings.json

 "terminal.integrated.fontFamily": "MesloLGS NF",
 "terminal.integrated.defaultProfile.osx": "zsh",
 "terminal.external.osxExec": "iTerm.app",

If you’re wondering where I got “MesloLGS NF” from - You can find it on iTerm’s setting.

Just go to iTerm -> Settings -> Profiles -> Text -> Font

VSCode Preference

VSCode Preference

Step 3. Save & Restart VSCode

And voila! Your VSCode terminal should now have a new font.

VSCode Terminal

Published 30 Oct 2023

    Read more

     — @next/bundle-analyzer throw error Module not found: Can't resolve child_process
     — Angular Material 15 Migration
     — Angular augmenting native elements
     — Upgrading from Angular 12 to 15 in Nx Workspace: A Comprehensive Guide
     — nx:run-commands output not colored

    Follow @trungvose on Twitter for more!