How to add an external font to your website or web project in VS Code

There are scenarios where you would want to add a font style let’s say Futura or another font that is not installed on your system to your project.

First, download the font at windows fonts then unzip and install the .ttf files in the zip file you downloaded. Look at the image below.

How to add an external font to your website or web project in VS Code “Picture”
This is an example of the futura TTF files I downloaded

So after installing it on your computer, in your user settings JSON file (File > Preferences > User Settings), override theeditor.fontFamily see image below

How to add an external font to your website or web project in VS Code
The Settings.json

If you want your VS Code to use that same font on your coding platform then remove the comment on that image above if not then there is no need to add it there.

Now you can add the specific font style you already installed to your CSS or Javascript or anywhere you want to use it. example font-family: “futura”

Abanobi Chukwuma Godswill “Unique”

--

--

Chukwuma Godswill Abanobi “Unique”

A full-stack developer that enjoys critical thinking, communication, Problem Solving and consistently contribute to team efforts and organization