Technical Documentation: tonsky/FiraCode
ℹ️ Provenance: Multi-Tier Ingestion · CodeWiki Reference
Overview (`README.md`)
Fira Code: free monospaced font with programming ligatures
Read in Español | 简体中文 | 日本語 | Português brasileiro
Problem
Programmers use a lot of symbols, often encoded with several characters. For the human brain, sequences like ->, <=, or := are single logical tokens, even if they take two or three characters on the screen. Your eye spends a non-zero amount of energy to scan, parse and join multiple characters into a single logical one. Ideally, all programming languages should be designed with full-fledged Unicode symbols for operators, but that’s not the case yet.
Solution
Fira Code is a free monospaced font containing ligatures for common programming multi-character combinations. This is just a font rendering feature: underlying code remains ASCII-compatible. This helps to read and understand code faster. For some frequent sequences like .. or //, ligatures allow us to correct spacing.
Download & Install
Then:
What’s in the box?
Left: ligatures as rendered in Fira Code. Right: same character sequences without ligatures.
Fira Code comes with a huge variety of arrows. Even better: you can make them as long as you like and combine start/middle/end fragments however you want!
Fira Code is not only about ligatures. Some fine-tuning is done for punctuation and frequent letter pairs.
Fira Code comes with a few different character variants (cv01, cv02, etc), stylistic sets (ss01, ss02, etc), and other font features (zero, onum, calt, etc), so that everyone can choose what’s best for them. How to enable
Some ligatures can be altered or enabled using stylistic sets/character variants:
Being a programming font, Fira Code has fantastic support for ASCII/box drawing, powerline, and other forms of console UIs:
Fira Code is the first programming font to offer dedicated glyphs to render progress bars:
In action:
We hope more programming fonts will adopt this convention and ship their own versions. Implementation detail: there is no way for programs to detect whether a font has progress bar glyphs at U+EE00, so they need to decide what to output without knowing if it will be rendered properly or not. We propose a new environment variable, UNICODE_PROGRESS_BAR=true, to use as a heuristic. If present, it’s safe to assume U+EE00..EE0B will be rendered properly.
Unicode coverage makes Fira Code a great choice for mathematical writing:
How does it look?
Editor compatibility list
| Works | Doesn’t work |
|---|---|
| Arduino IDE (2.0+,same instructions as vscode) | Adobe Dreamweaver |
| Abricotine | Delphi IDE |
| Android Studio (2.3+, instructions) | Standalone Emacs (workaround) |
| Anjuta (unless at the EOF) | IDLE |
| AppCode (2016.2+, instructions) | KDevelop 4 |
| Atom 1.1 or newer (instructions) | Monkey Studio IDE |
| BBEdit (14.6+ instructions) | UltraEdit (Windows) |
| Brackets (with this plugin) | |
| Chocolat | |
| CLion (2016.2+, instructions) | |
| Cloud9 (instructions) | |
| Coda 2 | |
| CodeLite | |
| CodeRunner | |
| Comma (Under: Preferences > Editor > Font) | |
| CotEditor | |
| Eclipse | |
| EditPad | |
| elementary Code | |
| Geany (1.37+) | |
| gEdit / Pluma | |
| GNOME Builder | |
| Godot | |
| GoormIDE (instructions) | |
| gVim (Windows, GTK) | |
| IntelliJ IDEA (2016.2+, instructions) | |
| Kate, KWrite | |
| KDevelop 5+ | |
| Komodo | |
| Leafpad | |
| LibreOffice | |
| LightTable (instructions) | |
| LINQPad | |
| MacVim 7.4 or newer (instructions) | |
| Mancy | |
| MATLAB (instructions) | |
| Meld | |
| Mousepad | |
| NeoVim-gtk | |
| NetBeans | |
| Notepad (Windows) | |
| Notepad++ (instructions) | |
| Notepad3 (instructions) | |
| Nova | |
| PhpStorm (2016.2+, instructions) | |
| PyCharm (2016.2+, instructions) | |
| QOwnNotes (21.16.6+) | |
| QtCreator | |
| Rider | |
| RStudio (instructions) | |
| RubyMine (2016.2+, instructions) | |
| Scratch | |
| Scribus (1.5.3+) | |
| SublimeText (3146+) | |
| Spyder IDE (only with Qt5) | |
| SuperCollider 3 | |
| TeXShop | |
| TextAdept (Linux, macOS) | |
| TextEdit | |
| TextMate 2 | |
| UltraEdit (UEX) (Linux) | |
| VimR (instructions) | |
| Visual Studio (2015+, instructions) | |
| Visual Studio Code (instructions) | |
| WebStorm (2016.2+, instructions) | |
| Xamarin Studio/Monodevelop | |
| Xcode (8.0+, otherwise with plugin) | |
| Xi | |
| Probably work: Smultron, Vico | Under question: Code::Blocks IDE |
| Zed (instructions) |
Terminal compatibility list
| Works | Doesn’t work |
|---|---|
| crosh (instructions) | Alacritty |
| Ghostty | Asbru Connection Manager |
| Hyper (see #3607) | Cmder |
| iTerm 2 | ConEmu |
| Kitty | GNOME Terminal (ticket) |
| Konsole | gtkterm (ticket) |
| Mintty | guake (ticket) |
| QTerminal | LXTerminal (ticket) |
| st (patch) | mate-terminal |
| Tabby | PuTTY |
| Terminal.app | rxvt |
| Termux | sakura (ticket) |
| Token2Shell | SecureCRT |
| Wez’s terminal | Terminator (ticket) |
| Windows Terminal | terminology |
| ZOC (macOS) | Tilix |
| Windows Console | |
| xfce4-terminal (ticket) | |
| xterm | |
| ZOC (Windows) |
Browser support
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/distr/fira_code.css">/* CSS */
@import url(https://cdn.jsdelivr.net/npm/[email protected]/distr/fira_code.css);/* Specify in CSS */
code { font-family: 'Fira Code', monospace; }
@supports (font-variation-settings: normal) {
code { font-family: 'Fira Code VF', monospace; }
}- IE 10+, Edge Legacy: enable with
font-feature-settings: "calt"; - Firefox
- Safari
- Chromium-based browsers (Chrome, Opera)
- ACE
- CodeMirror (enable with
font-variant-ligatures: contextual;)
Projects using Fira Code
Alternatives
Free monospaced fonts with ligatures:
Paid monospaced fonts with ligatures:
Building Fira Code locally
In case you want to alter FiraCode.glyphs and build OTF/TTF/WOFF files yourself, this is the setup I use on macOS:
# install all required build tools
./script/bootstrap_macos.sh
# build the font files
./script/build.sh
# install OTFs to ~/Library/Fonts
cp distr/otf/*.otf ~/Library/FontsAlternatively, you can build Fira Code using Docker:
# install dependencies in a container and build the font files
make
# package the font files from dist/ into a zip
make packageIf you want to permanently enable certain style sets or character variations, maybe because your editor of choice does not allow you to toggle these individually, you can provide the desired features as a comma separated list to the build script via the -f / --features flag.Default: none.
To separate different versions of your font you can specify the desired font family name with the -n / --family-name flag. The special value 'features' will append a sorted, space separated list of enabled features to the default family name.Default: "Fira Code"
You can also limit the font weights that will be created with the -w / --weights option.Default: "Light,Regular,Retina,Medium,SemiBold,Bold"
# locally in your shell
./script/build.sh --features "ss02,ss08,ss10,cv03,cv07,cv14" --family-name "Fira Code straight" --weights "Regular,Bold"
# or via a docker container (creates the family name 'Fira Code cv01 cv02 cv06 cv31 onum ss01 ss03 ss04 zero')
docker run --rm -v "${PWD}":/opt tonsky/firacode:latest ./script/build.sh -f "cv01,cv02,cv06,ss01,zero,onum,ss03,ss04,cv31" -n "features"
# in Git Bash from Git for Windows, or any other MSYS2 based shell, you might need to disable path conversion
MSYS2_ARG_CONV_EXCL="*" docker run --rm -v "${PWD}":/opt tonsky/firacode:latest ./script/build.sh -f "ss02,ss03,ss04,ss05,ss06,ss07"Credits
- Author: Nikita Prokopov @nikitonsky
- Based on: Fira Mono
- Inspired by: Hasklig
Overview (`googlefonts-qa/README.md`)
Onboarding to Google Fonts
This directory is made to run a Google Fonts onboarding process for Fira Code.
The build.sh script builds variable and static font files as required by Google Fonts.
The move-check.sh script does a few things:
- Fixes a few pieces of font metadata to align them to Google Fonts standards
- Moves font files into a google/fonts directory, to prep/update a PR to the official google/fonts repo
- Runs FontBakery to check the fonts against Google Fonts standards, and saves results to the checks subfolder.
This process must be run multiple times, tweaking source files and rebuilding output fonts to solve issues flagged by FontBakery.
USAGE
First, setup prerequisites
If you haven't already done so, open a terminal, clone this repo, and move to the qa branch:
git clone [email protected]:thundernixon/firacode.git
cd firacode
git checkout qaFontBakery checks are made to be run on fonts within the folder structure of the google/fonts repo. Therefore, you must have a local copy of this repo on your computer to run this QA procedure. If you don't yet have a local google/fonts repo, open a new terminal session, navigate to a parent folder for this (e.g. cd ~/yourusername/type_repos, but use whatever location makes sense), and clone the repo:
git clone [email protected]:google/fonts.gitSecond, set up your testing environment
Create a Python 3 virtual environment:
virtualenv -p python3 build/venvThen, activate the new virtual environment:
source venv/bin/activateNow, install the QA dependencies:
pip install -U -r googlefonts-qa/scripts/requirements.txtGive the build and move-check scripts permission to run:
chmod +x googlefonts-qa/scripts/build.sh
chmod +x googlefonts-qa/scripts/move-check.shThird, use scripts to build fonts, then move and check
With your terminal at the top level of your Fira Code directory, build fresh copies of the relevant fonts by running:
googlefonts-qa/scripts/build.shWhen that completes, run the move-check script (using the path to your local google/fonts repo as an argument):
move-check <absolute_path_to_parent_dir>/fontsIf all goes well, you will have created a local firacode branch in your google fonts directory, moved the fresh fonts there, and run QA checks which will create new markdown documents at googlefonts-qa/scripts/checks. If following this guide doesn't work, please file an issue at thundernixon/firacode.
Calt Performance (`docs/calt_performance.md`)
Time to shape text with different calt code
Baseline:
sub 1 2 3 4 by 1_2_3_4.liga;Spacers:
sub 1.spacer 2.spacer 3.spacer 4' by 1_2_3_4.liga;
sub 1.spacer 2.spacer 3' 4 by 3.spacer;
sub 1.spacer 2' 3 4 by 2.spacer;
sub 1' 2 3 4 by 1.spacer;Lookups:
lookup 1_2_3_4 {
sub 1.spacer 2.spacer 3.spacer 4' by 1_2_3_4.liga;
sub 1.spacer 2.spacer 3' 4 by 3.spacer;
sub 1.spacer 2' 3 4 by 2.spacer;
sub 1' 2 3 4 by 1.spacer;
} 1_2_3_4;Ignores:
lookup 1_2_3_4 {
ignore sub 1 1' 2 3 4;
ignore sub 1' 2 3 4 4;
sub 1.spacer 2.spacer 3.spacer 4' by 1_2_3_4.liga;
sub 1.spacer 2.spacer 3' 4 by 3.spacer;
sub 1.spacer 2' 3 4 by 2.spacer;
sub 1' 2 3 4 by 1.spacer;
} 1_2_3_4;Benchmark:
time hb-shape -n 100000 distr/ttf/FiraCode-Regular.ttf "Hello +++ /// !== <-> world"Setup:
HarfBuzz 2.6.4
3,2 GHz 6-Core Intel Core i7
MacOS 10.15.3Results:
Baseline 0.407s
Spacers 1.415s
Lookups 2.080s
Ignores 2.656s--- METRICS ---
- Files Extracted: 3
- Estimated Token Budget: ~4063 tokens
- Canonical Reference: https://codewiki.google/github.com/tonsky/FiraCode