How to use custom font in visual studio code

First install the font on your machine if necessary. Then, in your user settings JSON file (File > Preferences > User Settings), override editor.fontFamily like so:

// Place your settings in this file to overwrite the default settings
{
    "editor.fontFamily": "Source Code Pro"
}

You may need to restart VSCode if it was already open when the font was first installed.


As a follow up to Nacimota's answer, to install custom fonts (using Windows 10 the following example) go through the tutorial here.

For me it was a matter of searching for "fonts" from my task bar then clicking the top result. From there I dragged all the files in the "target/TTF" directory, that is generated from following the Source Code Pro tutorial.


This is tested in VSCode 1.30.2 in Windows:

  1. Ensure the font is available. In Windows, ttf fonts can be installed via right click font file -> Install (requires elevation).
  2. Ctrl+, => Settings => type font-family
  3. Choose User Settings and Workspace Settings
  4. Go to Text Editor => Font Family => Change value (font family names with a blank might require single quotes). Example:

    'Fira Code', Consolas, 'Courier New', monospace
    
  5. Enable font ligatures (if needed)

  6. A VSCode restart might be required in order to see the new font applied

Note: after step 1, you can also press Open Settings (top-right corner) to edit directly the json settings. Example:

{
    "editor.fontFamily": "'Fira Code', Consolas, 'Courier New', monospace",
    "editor.fontLigatures": true
}