How to use custom font in visual studio code

Question

This isn\'t so much a coding question as it is about the visual studio code editor. What I want to do is use source code pro in the editor, but I don\'t know what to change

Answer 1

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.

Answer 2

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
}

Answer 3

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.