DEV Community

loading...

How to use JetBrainsMono in VSCode (New font in the town)

shofol profile image Anower Jahan Shofol ・1 min read

JetBrains has released a typeface for all of their IDEs and this is opensource!😊 So, VSCode lovers or other IDE guys can also try this! For VSCode users-

  • Install the Font Pack in your computer (Guide is here-https://www.jetbrains.com/lp/mono/)
  • Go to Preferences->Settings->Font and then change the font to JetBrains Mono. You can Follow this gif-

Use it or not, you should have a look at their site at least. It is great! People are twitting about it!

Discussion (13)

pic
Editor guide
Collapse
aris profile image
Aris Ripandi

Don't forget to use recomended settings, such as:

{
  "editor.fontSize": 13,
  "editor.fontWeight": "300",
  "editor.letterSpacing": 1.2,
  "editor.lineHeight": 22,
  "editor.fontLigatures": true,
}
Enter fullscreen mode Exit fullscreen mode
Collapse
thorstenhirsch profile image
Thorsten Hirsch

Do you really use these settings? I've removed some of them. I think it looks much better like this:

{
    "editor.fontFamily": "JetBrains Mono",
    "editor.fontSize": 13,
    "editor.fontLigatures": true,
}
Enter fullscreen mode Exit fullscreen mode
Collapse
natureminded profile image
tk • Edited

@aris @thorstenhirsch --

"editor.fontLigatures": true,
Enter fullscreen mode Exit fullscreen mode

FTW 🙌

Collapse
aris profile image
Collapse
benabbes profile image
Ben Abbes

The only recommended settings is :

{
  "editor.fontSize": 13,
  "editor.letterSpacing": 1.2
}

ligature are optionnal :

{
  "editor.fontLigatures": true
}

and the 300 weight isn't icluded in the jetbrains mono font, so it's not recommended to use what's not availible.

Collapse
mbled profile image
Maciej Błędkowski

Actually they recommend setting up line spacing to 1.2, not the letter spacing afaik (jetbrains.com/lp/mono/#how-to-install)

Thread Thread
benabbes profile image
Ben Abbes

You're re right, I didn't pay attention.
I would like to point out that line height of 1.2 is relative, and not absolute (not 1.2px), and it's already the standard default.

Collapse
thompcd profile image
Corey Thompson

Thanks for that! Was trying to figure out what I missed. :) I had to bump down the height and spacing, but I'm liking it so far!

Collapse
aris profile image
Aris Ripandi

You're welcome Corey :)

Collapse
helen8297 profile image
Helen Kent

How do you access these settings to change them like this? I can only use the preferences button.

Collapse
shofol profile image
Anower Jahan Shofol Author • Edited

Hi @helen , you can see the process in the gif.

Thread Thread
vintprox profile image
Rodion Borisov

bruh, this GIF is small xD

Collapse
josegus profile image
Gustavo Vasquez

font weight doesn't look good