Lisnoti Lisnoti Code

Lisnoti Code

The Lisnoti Code type card: sample letters, the code x => x != 0 with its ligatures, the alphabet and figures

Lisnoti Code is a proportional font for coding that typically fits 20–30% more code on a line than popular monospaced fonts.

The case for using proportional fonts for code largely comes down to efficiency – they’re faster and easier to read, and make better use of space. That case has been well made by Bevan Arps, Martijn Storck, Nelson Minar and David Jonathan Ross (and I’ve had a go here).

But font design still matters:

  • Il1 and O0 need to be clearly distinguishable.
  • Programming languages use the hyphen as a minus sign (−), but it looks like a short dash (-) in most fonts.
  • Proportional fonts have narrow spaces that make indentation tight and errors hard to spot.
  • Ligatures can make multi-character operators like >= or |> clearer by drawing them as single symbols, >= or |>.

Lisnoti Code addresses all of these issues. Try it out below.

Get Lisnoti Code

Version 0.903 · regular, italic, bold and bold italic · free under the SIL Open Font Licence

Did you know that Lisnoti Code is based on Lisnoti, a font for everyday use with especially good support for math? See Lisnoti.

Try it

Pick an example, or type in the left-hand box, which uses Lisnoti Code. The right-hand box reproduces the same code at the same size but in your choice of monospaced font.

Compare

Lisnoti Code

Fira Code


				

			

			

		

	







	

		
Key features

		

			Lisnoti Code inherits Lisnoti’s clarity and aesthetics,
			but with additional features specifically to help with writing code.
		

		

			

				
No lookalikes

				
Il1 O0 Il1 O0 Il1 O0

				
Capital I, small l and number 1 are always distinct, as are capital O and number 0.

			

			

				
A real minus

				
-5 + x - y test-main

				

					Many monospaced fonts make the hyphen a compromise between true hyphen and true minus.
					Lisnoti Code uses context to do both.
				

			

			

				
Spacing designed for code

				
if ready:
    start(now)

				

					Lisnoti Code sets runs of spaces as extra wide to make indentation levels clear,
					but leaves single spaces at normal width for readability.
				

			

			

				
Trees that line up

				
src/
├── main.py
└── tests/
    └── test_main.py

				
Box-drawing characters are as wide as the wide space, so directory trees join up and line up.

			

			

				
Code-friendly ligatures

				

					
Equality==========!=!=!==!==

					
Relations<=<=>=>=

					
Arrows->-><-<-=>=>

					
Pipes|>|>||>||>|||>|||><|<|<||<||

				

				
If you don’t want these ligatures and your editor can’t switch them off, use Lisnoti Code NL.

			

			

				
Comprehensive symbols

				
=≠ ≡≢ <≤ ⊂⊆ ±∓ ∞∝ ∪⊔∨⊻ ∀∃∈∉∅ √∫∂ ∑∏⋀⋃ β⁽⁰⁾ΔΘ x₀ f′ ⊕ ✓✗☑♔♞♠ $£€₹⃁

				
5,700-plus characters, including every operator Julia parses, so nothing has to be borrowed from another font.

			

		

	







	

		
FAQ

		

			

				Aren’t monospaced fonts better for code?
				

					Monospaced fonts are mostly just familiar.
					Many (not all) objections to proportional fonts boil down to
				

				
    
					
  • habit, i.e. people are simply used to monospace for code, and
    • 
					
  • misconceptions about proportional fonts – see the indentation FAQ below.
    • 
				

				
Proportional fonts are easier to read, make better use of space and have excellent support in most code editors and IDEs.

				
Why not try Lisnoti Code for a week before deciding? (But do read the other FAQs first!)

			

			

				Does indentation still work?
				

					Yes, of course indentation still works – indentations
					line up because indents use the same characters.
				

				

					Lisnoti Code helps by making runs of spaces wide so that each level is
					easy to see, while using normal spaces between words for readability.
				

			

			

				What about code that aligns text in columns?
				

					Trying to align columns using spaces is never going to work well with a proportional font.
				

				

					But that’s arguably a brittle way of writing code because
					it means that a one-line change can require repadding other lines,
					which is diff-unfriendly, and why many coding standards discourage
				

				
    
					
  • aligning trailing (aka hanging) comments, and
    • 
					
  • aligning at = signs.
    • 
				

				

					If you follow those coding standards, then proportional fonts will work just fine.
				

			

			

				When is monospace the right choice?
				

					Sometimes monospace is exactly what you want:
				

				
    
					
  • working in a terminal,
    • 
					
  • editing hex data,
    • 
					
  • writing assembly, or
    • 
					
  • drawing ASCII tables and art.
    • 
				

				

					This is why the VS Code settings below set
					terminal.integrated.fontFamily to a monospace family. Similar settings may
					be available in other IDEs.
				

			

			

				Why have math symbols in a coding font?
				

					Math and other symbols turn up in documentation all the time. And in Julia they are
					actual code.
				

				

					When a character is missing from a font, editors either show a meaningless
					replacement box or borrow the missing character from another font, which rarely
					matches. With Lisnoti Code you’re unlikely to have this problem.
				

			

			

				Ligatures don’t work on my setup
				
Many editors switch ligatures off unless told otherwise. In VS Code, add these to your settings:

				
"editor.fontFamily": "Lisnoti Code",
"editor.fontLigatures": true

				
Other editors usually have a similar setting.

				

					If every space looks the same width, the app has switched off contextual
					alternates (calt) as well. To keep the spacing and the short hyphen
					without the ligatures, VS Code takes
					"editor.fontLigatures": "'liga' off, 'calt' on".
				

				

					Safari, and every browser on an iPhone or iPad, cannot apply the spacing rule, so
					Lisnoti Code’s web stylesheet switches it off there (which makes all spaces
					moderately wide).
				

			

			

				What if I don’t want ligatures but my editor can’t switch them off?
				

					Use Lisnoti Code NL instead – it is provided for this specific scenario
					because some editors, e.g. Visual Studio, have no way to switch ligatures off.
				

				

					Lisnoti Code NL is identical to Lisnoti Code but with no ligatures (‘NL’).
					The spacing, hyphen and the box drawing behaviour remain the same as with Lisnoti Code.
				

				

					Lisnoti Code NL and Lisnoti Code can be installed alongside each other.
				

				

					If you want to see what it looks like, just untick
					Ligatures in the Try it section above.
				

				

					Download
					LisnotiCodeNL-ttf.zip
					and install the fonts in the usual way (see Get Lisnoti Code).
				

			

		

	







	

		
Every character

		
Lisnoti Code has over 5,700 characters. Pick a group, then point at or tap a character.

		

			

			

				

				
			

		

	







	

		
Get Lisnoti Code

		
There are three ways to use Lisnoti Code:

		

			

				
1. Install it

				
Download the four fonts and install them in the usual way.

				
    
					
  • Windows: select the files, right-click and choose Install.
    • 
					
  • Mac: open the files in Font Book.
    • 
				

				
LisnotiCode-ttf.zip

				

					For editors that can’t switch ligatures off, there is Lisnoti Code NL
					(Lisnoti Code with no ligatures).
					The files are in
					LisnotiCodeNL-ttf.zip.
				

			

			

				
2. Link to lisnoti.com

				
Add the following line to each page’s <head>:

				

					
<link rel="stylesheet" href="https://lisnoti.com/lisnoti-code.css">

					
				

				
and name the font in your CSS:

				

					
code, pre { font-family: 'Lisnoti Code', monospace; }

					
				

				
Pages fetch only the subsets they need: about 26 KB per style for English text.

			

			

				
3. Host it yourself

				

					Download LisnotiCode-woff2.zip,
					copy the folder into your site and link its lisnoti-code.css. Keep the
					stylesheet in the folder with its font files.
				

				

					For one file per style, use
					LisnotiCode-woff2-monolithic.zip
					and its lisnoti-code-monolithic.css.
				

			

		

		

			

				
VS Code

				
VS Code switches the ligatures and spacing off unless told otherwise, so add these to your settings:

				

					
"editor.fontFamily": "Lisnoti Code",
"editor.fontLigatures": true,
"terminal.integrated.fontFamily": "Consolas, Menlo, monospace"

					
				

				
A terminal needs a monospaced font, so the last line keeps VS Code’s terminal on one.

			

			

				
Can’t find Lisnoti Code in your editor’s font list?

				
Some editors list only monospaced fonts until told otherwise.

				

					Look for a setting such as ‘Show only monospaced fonts’ and untick it, or type
					the name ‘Lisnoti Code’ in directly.
				

				

					In JetBrains IDEs such as IntelliJ IDEA and PyCharm, the font settings are under
					Settings › Editor › Font, where you can also tick ‘Enable
					ligatures’.