Fira Code as the IDE font

Date posted: 2022-01-04

Category: Web Development

Tags: IDE,Front-end,ligatures,CSS,HTML,JS

Download the Font here and install.

I use both VSCode and WebStorm as my daily IDE's. For both of these I have Fira Code set as the font for the text editor. The advantages of using ligatures are shown below.

How map array looks with ligatures enabled: Ligatures examples

How map array looks with ligatures disabled: Ligatures examples

How ligatures look with common JS:

// Equality:
== ===

// Scope:
=> -> __

// Comparison:
<= >= != !==

Best thing with this font is that it works with more than one language. It has support for PHP, Swift, Ruby, and Go.

Example from GitRepo: Ligatures examples

You'll need to enable font-ligatures in the IDE settings:

VScode:

VSCode ligatures settings

WebStorm:

WebStorm ligatures settings