2

When ever character matters (code development, etc.), there is a need for a font that meets the following:

  1. Monospaced
  2. Easily distinguishes between the uppercase letter O and the number 0. (Two circles with slightly different widths leaves plenty of room for error.)
  3. Easily distinguishes between the number 1, lowercase L and uppercase L
  4. Included on most devices ("Web safe"?)

Different characters that appear identical are known as "homoglyphs".

Example image of "Segoe UI" font failing the first three requirements (most importantly #2 and #3):
Segoe UI capital O and number 0 Segoe UI number 1, lowercase l, and uppercase L

Example image of "Consolas" font passing first three requirements:
Consolas capital O and number 0 Consolas number 1, lowercase l, and uppercase L

For fun, here are the same characters as text, presented with the "code sample" formatting. How they are displayed is dependent on your device:

O 0    1 l L

Finding a font that passes requirement 1 through 3 isn't hard to find - Consolas is a good choice. But as I'm aware, Consolas isn't included by default on most if not all Mac OS. So what are some next-best choices?

6
  • Works fine here, macOS Mojave. Font appears to be Menlo - i.sstatic.net/MslPD.png Stack Exchange just switched to using system fonts, so I'd guess that's the default. I have neither Segoe nor Consolas, so I can't compare.
    – Tetsujin
    Commented May 20, 2021 at 17:50
  • [I'm not much of a font 'eggspurt' so I'm not sure whether I ought to post that as an answer or not]
    – Tetsujin
    Commented May 20, 2021 at 17:55
  • @Tetsujin My Windows 10 machine doesn't have Menlo. :( Good to know of it for Macs though.
    – Bort
    Commented May 20, 2021 at 20:19
  • 3
    Unless you have some very specific requirements, ‘web safe’ isn’t really a thing anymore. Web fonts are almost universally supported now, and using something from Google Fonts will give you excellent results nearly everywhere. Commented May 21, 2021 at 9:08
  • @JanusBahsJacquet Whatever the correct term may be, I'm looking for a monospaced font that avoids common homoglyphs. What's a font that meets that requirement and can be obtained from Google Fonts? Does Consolas fit that bill?
    – Bort
    Commented May 21, 2021 at 13:03

2 Answers 2

2

See @Janus Bahs Jacuuet's comment on the original question. I just ended up using a Google Font: https://fonts.google.com/

I went with 'Source Code Pro', but there are many monospace fonts that meet the original poster's requirements.

From https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Web_fonts :

  • Go to Google Fonts.
  • Use the filters on the left-hand side to display the kinds of fonts you want to choose and choose a couple of fonts you like.
  • To select a font family, press the button alongside it.
  • When you've chosen the font families, press the [Number] Families Selected bar at the bottom of the page.
  • In the resulting screen, you first need to copy the line of HTML code shown and paste it into the head of your HTML file. Put it above the existing <link> element, so that the font is imported before you try to use it in your CSS.
  • You then need to copy the CSS declarations listed into your CSS as appropriate, to apply the custom fonts to your HTML.
0

If your budget allows licensing a font, I really recommend fonts by Toshi Omagari, a font designer who specialises in monospace fonts. (Full disclosure: I've met him, he's a really nice guy.) Many of his fonts e.g. Codelia or Belinsky Text fit your requirements and have a lot of character.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.