Commit Mono – Neutral programming typeface(commitmono.com)
commitmono.com
Commit Mono – Neutral programming typeface
https://commitmono.com/
113 comments
It’s true, some monospace fonts have absurd ligatures enabled by default.
The craziest thing I’ve seen was a single-width “fi” ligature. The only point of this ligature in proportional fonts is to prevent the dot on the ‘i’ from overlapping with the hook of the ‘f’, and that by definition can’t happen in monospace! But you madmen decided to create a single “fi” glyph, like it was a letter of its own. Imagine that on a typewriter.
The craziest thing I’ve seen was a single-width “fi” ligature. The only point of this ligature in proportional fonts is to prevent the dot on the ‘i’ from overlapping with the hook of the ‘f’, and that by definition can’t happen in monospace! But you madmen decided to create a single “fi” glyph, like it was a letter of its own. Imagine that on a typewriter.
IMO, even as someone who really likes ligatures in general, in a monospace font the invariant of 1 character text - 1 character displayed - 1 character width must be upheld. I'm all for => getting turned into a 2 character wide arrow, or === and == getting little dots above them and whatever. But never, under any circumstances, should my font change character alignment.
Personally I've been using a lot of Cascadia Code lately. Big fan.
Personally I've been using a lot of Cascadia Code lately. Big fan.
Unicode U+FB01 is the fi ligature as a single precombined codepoint. You're right - it doesn't make any sense to have a monospaced glyph for that ligature, or for fl or ffi or many other codepoints in the Alphabetic Presentation Forms block. But those codepoints exist, and somebody might print them to the terminal, and a terminal has to represent every non-CJK glyph as a single character cell...
> a terminal has to represent every non-CJK glyph as a single character cell...
Not necessarily. Unicode has a dedicated property called East Asian Width [1] which effectively affects the terminal rendering, and "Ambiguous" characters like arrows can be configured as full-width (because CJK users expect that). Even when the configuration itself doesn't exist, the font metric may be used to infer the glyph width in this case.
[1] https://www.unicode.org/reports/tr11/
Not necessarily. Unicode has a dedicated property called East Asian Width [1] which effectively affects the terminal rendering, and "Ambiguous" characters like arrows can be configured as full-width (because CJK users expect that). Even when the configuration itself doesn't exist, the font metric may be used to infer the glyph width in this case.
[1] https://www.unicode.org/reports/tr11/
I like the typeface. The website navigation is really fun. A little confusing until you are used to it, but I like the logic of it. Still unclear which widgets can receive input other than navigation. It would be nice to have some clear visual indicator. Some widgets use arrow keys to change state (tabs, toggles, etc.) rather than just move focus around, which I found surprising. Seems like state changes ought to require a distinct input from the focus-affecting input. Some cases certainly blur the lines, such as when navigating over glyphs and seeing captions on focus changes. On the whole, I really enjoyed it. I wish more UIs would experiment with this kind of stuff.
Whether or not one personally likes the idiosyncratic navigation, it’s inconsistent with the font’s normcore ethos
You're so right, but if I made the site boring people wouldn't have anything to complain about.
Just an FYI, some features don't work with Dvorak keyboards.
For instance, the "I" key doesn't work (I assume you are using keyCodes, not strings, for characters). That is, it I press "C" (in Dvorak), I get italics on page 2. If I press "I" (in Dvorak), I don't. (I tested on two browsers to confirm.)
Nice font, BTW. I also like the site.
For instance, the "I" key doesn't work (I assume you are using keyCodes, not strings, for characters). That is, it I press "C" (in Dvorak), I get italics on page 2. If I press "I" (in Dvorak), I don't. (I tested on two browsers to confirm.)
Nice font, BTW. I also like the site.
The shortcuts also do not work properly on the most common US QWERTY layout (eg. the "-" key does not).
They do work on most EU layouts though, where eg. "-" is placed left of Right Shift (on US QWERTY it is right of "0"), which likely indicates the author made this using some EU keymap...
As a guess, this is using deprecated keycodes [1] instead of just characters.
[1]: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEve...
They do work on most EU layouts though, where eg. "-" is placed left of Right Shift (on US QWERTY it is right of "0"), which likely indicates the author made this using some EU keymap...
As a guess, this is using deprecated keycodes [1] instead of just characters.
[1]: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEve...
True.
Let's see if this can unseat Comic Code. We are truly living in the golden age of programming typefaces.
Ignore the haters. The website is lots of fun.
Ignore the haters. The website is lots of fun.
‘Smart kerning’ is brilliant, and the fact this looks like a more normal Source Code Pro is winning me over as well.
I'm really intrigued by the smart kerning idea. Are there any other monospace fonts that do this?
Is there a term for "smart kerning" this that digital typographers use? Is it a feature of OpenType? Is it similar to/controlled be the font-kerning property in CSS?
> Smart kerning works by looking at single letter between two other letters. If the other letters are in different width classes, the middle letter will slide closer to the narrow letter.
From this paragraph it sounds like they're using ligatures, which are rules of "when this character sequence appears, use this glyph instead."
But A) I'm no OTF expert, and B) I haven't dissected the font files.
From this paragraph it sounds like they're using ligatures, which are rules of "when this character sequence appears, use this glyph instead."
But A) I'm no OTF expert, and B) I haven't dissected the font files.
The font files with smart kerning don't contain any ligatures.
It seems they are using glyph substitution tables but I also didn't look in too much detail
Is this supposed to be so dim in light mode? It looks like it's covered in an invisible modal's backdrop.
I had a difficult time reading this page, the low contrast reduces legibility. Surprising for a site focused on fine details of type and design.
The font is nice but the site’s contrast is ridiculous. I had to hit F12 and fix the CSS to be able to see anything.
The typeface looks nice, but I first opened the site on mobile and it told me to use keys to navigate, effectively locking me out from browsing it.
I then opened it on desktop, tried to scroll and realised that it uses WASD keys which are all over my keyboard. The scroll wheel on my mouse/trackpad/etc don't work. As a user of a non-QWERTY layout this sucks.
Then I tried to use the text zoom and while it documents this as being controlled by + and -, it's actually controlled by _ and /. This suggests careless handling of input.
Why does this matter? I think a very important thing for typefaces is accessibility and coverage of edge-cases in language and usage. Covering characters that are used in different languages (even just punctuation that isn't common in English), ensuring readability for those without perfect vision, and so on, all require care and attention to a wide range of concerns.
This website doesn't instil confidence that the designers of the typeface have taken this approach, and in fact the interaction model (which I actually really like) gives the impression of style over substance.
I then opened it on desktop, tried to scroll and realised that it uses WASD keys which are all over my keyboard. The scroll wheel on my mouse/trackpad/etc don't work. As a user of a non-QWERTY layout this sucks.
Then I tried to use the text zoom and while it documents this as being controlled by + and -, it's actually controlled by _ and /. This suggests careless handling of input.
Why does this matter? I think a very important thing for typefaces is accessibility and coverage of edge-cases in language and usage. Covering characters that are used in different languages (even just punctuation that isn't common in English), ensuring readability for those without perfect vision, and so on, all require care and attention to a wide range of concerns.
This website doesn't instil confidence that the designers of the typeface have taken this approach, and in fact the interaction model (which I actually really like) gives the impression of style over substance.
It's an overly stylized affectation for a font website but everything here is mouse-accessible; I didn't use my keyboard at all. My scroll wheel works and you can click on the key buttons on the bottom and the categories on the top.
Looks like you're right. The first time you try clicking it shows a message telling you to use the keyboard to navigate and then flashes the list of keyboard controls. I didn't try clicking again after that.
Scrolling is completely broken for both trackpads and mice scroll wheel, so no, not everything is accessible. At least not in a non-buggy way. Scrolling on a web page should never be buggy.
It works perfectly fine on my MBP.
It was fixed. Before, there were nested scroll areas, interfering with each other. Now, at least from a quick test in the 02 and 03 pages, it works better.
It's not very nice for mobile views but I do like seeing something new every once in a while.
The top seciton names are clickable on mobile
I have a normal qwerty layout and opened it on a laptop and my first thought was "why the hell cant i scroll?"
It's a stupid website. It took more work to make it shittier to use. It's a loss for the author AND the viewer. Counterproductive.
The font seems decent but I closed the tab because I don't have this kind of time.
It's a stupid website. It took more work to make it shittier to use. It's a loss for the author AND the viewer. Counterproductive.
The font seems decent but I closed the tab because I don't have this kind of time.
Minor frustration -- I'm reading the directions to install, but when I focus out (to update my VSCode settings as instructed), the screen goes into low contrast, making it harder to read the directions.
Also, section navigation by number works with the number row keys but not the num pad. I would have expected all number keys to work the same since it doesn't specify otherwise.
I gave up. What a terrible website.
Accessibility may matter, but terminal hipsterism is likely to matter more for the target audience, and thus reflect the values of the project better.
"terminal hipsterism"
That's a very apt way to put it, haha. Might steal that for future references, thanks!
That's a very apt way to put it, haha. Might steal that for future references, thanks!
Same feelings about it here. The font actually looks pretty nice, but I won't be using it because that website is utter garbage. I take no issue with the creator taking the time to code up a cute terminal-like interface, but there absolutely needs to be a link to a basic version of the site (and it needs to not require me to press a key to navigate to that link).
Why is the light mode so dim? I thought something was wrong at first, like there was a modal background covering the screen that I couldn't clear.
I like the font, and the creativity of the website. Thanks, author, if you're watching!
Thank you so much!
> The slashed '0' is easy to tell apart from 'O' at small sizes
Funnily enough, viewing 27" at 140ppi from 1 meter, my brain mistook the slashed '0' for a 6 or 8 when looking at the headings.
Funnily enough, viewing 27" at 140ppi from 1 meter, my brain mistook the slashed '0' for a 6 or 8 when looking at the headings.
Nice! I love testing new fonts.
Using wezterm and alacritty (fedora 38) they look wildly different from JetBrains Mono - specially the width/ line height, but on the website they look similar in width/line height.
Anyone knows why? Any tips? Ty!
Using wezterm and alacritty (fedora 38) they look wildly different from JetBrains Mono - specially the width/ line height, but on the website they look similar in width/line height.
Anyone knows why? Any tips? Ty!
I found setting config.line_height = 1.2 (or 1.3) fixed it up for me, I had the exact same reaction as to you with the line height!
In Alacritty?
Oh, I know the site design is getting a lot of hate but I think its very cool. I love seeing plays on interfaces like this, would love to hear more about how it was made and what inspired it!
Either it does not have hinting, or it looks not nice on a laptop with FullHD screen. I've created a website to compare monospace fonts on something resembling a work environment: https://alexey-milovidov.github.io/font-selector/
It’s quiet, unopinionated and calming. It doesn’t draw attention to itself at all. I like it a lot.
Love the font, don't care for the website -- it was very hard to navigate.
agreed - the contrast is so low that I double checked if my content blocker was removing some cookie modal while leaving an opaque gray backdrop. Then I focused on a different window and then an opaque gray backdrop appeared, for reasons I can't imagine, with a message saying "Click to focus page". Not the best introduction for such an everyday tool
I also had to check if my adblocker was blocking something extra - this site is definitely a unique experience when it comes to using and navigating it.
> There are better ways to design than putting a big effort into making something look special. Special is generally less useful than normal, and less rewarding in the long term. Special things demand attention for the wrong reasons, interrupting potentially good atmosphere with their awkward presence. — Jasper Morrison, Super Normal Manifesto
What a fantastic quote this site's author chose to illustrate why I might like this font!
> To use all features, visit website on desktop.
Also on this website though... :(
What a fantastic quote this site's author chose to illustrate why I might like this font!
> To use all features, visit website on desktop.
Also on this website though... :(
I cannot unzip the download on a Mac…
Had the same issue with built in Archive Utility but I got it to unzip with the app The Unarchiver. The regular font files work but it does say this about all of the Italic font files:
>Could not extract "CommitMono-450-Italic.otf" from the "CommitMono.zip" archive: The archive file is incomplete
>Could not extract "CommitMono-450-Italic.otf" from the "CommitMono.zip" archive: The archive file is incomplete
I found this on their FAQ: "There have been some problems with downloading .zip files from Safari. The download is tested to work in Chrome and FireFox."
Truly the Internet Explorer of the modern age.
(Perhaps this is Safari passing the download through some more rigorous "malware checker" on macOS that Chrome/Firefox doesn't have access too?)
(Perhaps this is Safari passing the download through some more rigorous "malware checker" on macOS that Chrome/Firefox doesn't have access too?)
There is JS that combines the files into a zip before downloading. I'd imagine that it's that code whose behavior differs between browsers.
Yeah, the zip downloaded through Safari is 217507 bytes, whereas through Brave it's 222258 bytes.
[To author] There's a typo on the "04 Intelligent" page: "effecient".
Actual program listings would make for better examples.
Btw, I use a non-Qwerty layout so WASD is nonsense to me.
Actual program listings would make for better examples.
Btw, I use a non-Qwerty layout so WASD is nonsense to me.
Hey, do the non-QWERTY have some other default that makes sense to offer as an option to WASD or is it better to have the alternative be it's configurable?
I would personally go for configurable. I use the keys that are equivalent to QWERTY’s ESDF keys so that I never have to move my hands from home row for movement in a game. When moving through text I prefer vim keybinds.
Thanks, I will will try to budget time for my little games for configurable keybinds, since they use very few keys I had so far hardcoded WASD but never thought about other keyboard layouts. Thanks for the input!
Alas, missing ℕ ℤ ⊢ λ. If you're missing lambda, you're out for me unfortunately. Maybe a future version will have a wider coverage of Unicode.
I have filed an issue on GitHub. If you have more characters to add I will look into it, just add a comment on that issue or submit a new one.
https://github.com/eigilnikolajsen/commit-mono/issues/9
Also missing ⇕, which is annoying if you use a prompt like starship.rs
My font is terminus https://files.ax86.net/terminus-ttf/ and is because byte dumps are blocky (no round edges) which makes easy to the eye and is somewhat vintage. At least in my experience.
I've tried every mono under the sun but I have yet to find one that can hold a candle to PragmataPro Mono Liga.
This font is not recognized as a monospaced font by both putty and mintty on my Windows 10, even after a reboot.
// sorry for the initial typo of mintty as minty
// sorry for the initial typo of mintty as minty
Scrolling is completely broken on this website. There is nothing cool about implementing a silly retro navigation style, if you don't either completely disable the modern navigation, or don't fully support both. Here, we have scrollers inside scrollers inside scrollers, oh my.
Update: seems to have been fixed, at least from a quick look at the 02 and 03 pages.
I tried it out, but quickly switched back to my favorite Hack[0]. It may be just that I'm used to it, but I find it easier to read.
[0] https://sourcefoundry.org/hack/
[0] https://sourcefoundry.org/hack/
Jetbrains Mono has been my goto since release. The ligatures are nice if you like those in your code views. (Hard to believe no one has mentioned this font yet.)
I used Jetbrains Mono right up until I found Intel Mono (https://github.com/intel/intel-one-mono) and I’ve been using it since.
Something about the braces in Intel Mono feel too exaggerated for me.
I felt the same until I used it, and now I feel like the braces in other fonts aren’t exaggerated enough.
For those who are unsure why 'neutrality' is a desirable quality in a typeface, I refer you to the analogy of the crystal goblet by Beatrice Warde:
> Imagine that you have before you a flagon of wine. You may choose your own favourite vintage for this imaginary demonstration, so that it be a deep shimmering crimson in colour. You have two goblets before you. One is of solid gold, wrought in the most exquisite patterns. The other is of crystal-clear glass, thin as a bubble, and as transparent. Pour and drink; and according to your choice of goblet, I shall know whether or not you are a connoisseur of wine. For if you have no feelings about wine one way or the other, you will want the sensation of drinking the stuff out of a vessel that may have cost thousands of pounds; but if you are a member of that vanishing tribe, the amateurs of fine vintages, you will choose the crystal, because everything about it is calculated to reveal rather than to hide the beautiful thing which it was meant to contain.
> Bear with me in this long-winded and fragrant metaphor; for you will find that almost all the virtues of the perfect wine-glass have a parallel in typography. There is the long, thin stem that obviates fingerprints on the bowl. Why? Because no cloud must come between your eyes and the fiery hearth of the liquid. Are not the margins on book pages similarly meant to obviate the necessity of fingering the type-pages? Again: The glass is colourless or at the most only faintly tinged in the bowl, because the connoisseur judges wine partly by its colour and is impatient of anything that alters it. There are a thousand mannerisms in typography that are as impudent and arbitrary as putting port in tumblers of red or green glass! When a goblet has a base that looks too small for security, it does not matter how cleverly it is weighted; you feel nervous lest it should tip over. There are ways of setting lines of type which may work well enough, and yet keep the reader subconsciously worried by the fear of 'doubling' lines, reading three words as one, and so forth.
> Printing demands a humility of mind, for the lack of which many of the fine arts are even now floundering in self-conscious and maudlin experiments. There is nothing simple or dull in achieving the transparent page. Vulgar ostentation is twice as easy as discipline. When you realise that ugly typography never effaces itself, you will be able to capture beauty as the wise men capture happiness by aiming at something else. The 'stunt typographer' learns the fickleness of rich men who hate to read. Not for them are long breaths held over serif and kern, they will not appreciate your splitting of hair-spaces. Nobody (save the other craftsmen) will appreciate half your skill. But you may spend endless years of happy experiment in devising that crystalline goblet which is worthy to hold the vintage of the human mind.
> Imagine that you have before you a flagon of wine. You may choose your own favourite vintage for this imaginary demonstration, so that it be a deep shimmering crimson in colour. You have two goblets before you. One is of solid gold, wrought in the most exquisite patterns. The other is of crystal-clear glass, thin as a bubble, and as transparent. Pour and drink; and according to your choice of goblet, I shall know whether or not you are a connoisseur of wine. For if you have no feelings about wine one way or the other, you will want the sensation of drinking the stuff out of a vessel that may have cost thousands of pounds; but if you are a member of that vanishing tribe, the amateurs of fine vintages, you will choose the crystal, because everything about it is calculated to reveal rather than to hide the beautiful thing which it was meant to contain.
> Bear with me in this long-winded and fragrant metaphor; for you will find that almost all the virtues of the perfect wine-glass have a parallel in typography. There is the long, thin stem that obviates fingerprints on the bowl. Why? Because no cloud must come between your eyes and the fiery hearth of the liquid. Are not the margins on book pages similarly meant to obviate the necessity of fingering the type-pages? Again: The glass is colourless or at the most only faintly tinged in the bowl, because the connoisseur judges wine partly by its colour and is impatient of anything that alters it. There are a thousand mannerisms in typography that are as impudent and arbitrary as putting port in tumblers of red or green glass! When a goblet has a base that looks too small for security, it does not matter how cleverly it is weighted; you feel nervous lest it should tip over. There are ways of setting lines of type which may work well enough, and yet keep the reader subconsciously worried by the fear of 'doubling' lines, reading three words as one, and so forth.
> Printing demands a humility of mind, for the lack of which many of the fine arts are even now floundering in self-conscious and maudlin experiments. There is nothing simple or dull in achieving the transparent page. Vulgar ostentation is twice as easy as discipline. When you realise that ugly typography never effaces itself, you will be able to capture beauty as the wise men capture happiness by aiming at something else. The 'stunt typographer' learns the fickleness of rich men who hate to read. Not for them are long breaths held over serif and kern, they will not appreciate your splitting of hair-spaces. Nobody (save the other craftsmen) will appreciate half your skill. But you may spend endless years of happy experiment in devising that crystalline goblet which is worthy to hold the vintage of the human mind.
As a counterpoint, I would refer you to type designer Matthew Butterick’s essay “Drowning the Crystal Goblet” :
https://practicaltypography.com/drowning-the-crystal-goblet....
https://practicaltypography.com/drowning-the-crystal-goblet....
> Let’s just pour concrete into the crystal goblet and toss it overboard, along with the banal idea of invisibility.
Love it. And I totally disagree.
Invisibility is akin to the food fight about intuitive user interfaces. (Right?) I've talked myself blue in the face about that one. As an advocate for "intuitive", I still have no idea what that means. Like all of us, I just know it when I see it. (Ha!)
Passionate, well argued, aesthetic disagreements are just the best.
Reminds me of the documentary Helvetica [2007]. https://www.imdb.com/title/tt0847817/
Love it. And I totally disagree.
Invisibility is akin to the food fight about intuitive user interfaces. (Right?) I've talked myself blue in the face about that one. As an advocate for "intuitive", I still have no idea what that means. Like all of us, I just know it when I see it. (Ha!)
Passionate, well argued, aesthetic disagreements are just the best.
Reminds me of the documentary Helvetica [2007]. https://www.imdb.com/title/tt0847817/
I liked this old take on intuitiveness, which focuses on which user(s) something is intuitive to and why:
https://articles.uie.com/design_intuitive/
https://articles.uie.com/design_intuitive/
This looks pretty good. Here's another one to check out if you want something thinner (more terminal space).
https://mplusfonts.github.io/#mpluscode
https://mplusfonts.github.io/#mpluscode
I really like it, it's fresh and friendly. it has a narrow option to have that compact spacing like iosevka which is my favorite. I can't use regular width font anymore after being use to narrow width.
Agree, if Commit Mono had a narrow width, it'd replace Iosevka for me in a heartbeat
How is ligature support? I didn't see anything explicit about ligatures. If you want to compete with some of the other compared fonts, there should be some support for ligatures.
The font and site both are very nice (nostalgic navigation made me smile). Thanks!
Nah, I want my zeros with a middle dot. Slash doesn't cut it.
That’s one of the options.
Nice, I didn't see that before. The text size on mobile is just too tiny.
Typeface is good, but that website is an absolute top tier gem.
[deleted]
I really like the typeface, but for some reason it looks "blurred" in comparison to all other mono fonts I have installed. Anyone noticed the same?
Does anyone know why it looks much better on VSC than WebStorm on Mac? Would love to love IntelliJ products but I can't stand the way they render text.
You might have to enable/disable (subpixel?) anti aliasing?
I couldn't find that option, I think they removed it. I improved it by changing the theme, dark themes seem to render a bolder text.
I'd imagine that IntelliJ products use whatever text renderer java has instead of the system renderer.
I like the glyphs, but the kerning between letters bothers me. For example the gaps between i and t, y and p, or the right side of lowercase o.
i like the font. it reminds me of andale mono.
but the color contrast on the website could do with an adjustment. it's not very good for accessibility.
but the color contrast on the website could do with an adjustment. it's not very good for accessibility.
the site is fine on both mobile and desktop. saying this as someone who has real accessibility issues everyday.
bookmarked. might give the font a try.
bookmarked. might give the font a try.
> Customize Commit Mono to your liking before you download
Great feature! I wish this would be more common. Thanks for sharing.
Great feature! I wish this would be more common. Thanks for sharing.
The horrible contrast ratio on that site doesn't bode well for the accessibility of the typeface.
Wow, the website navigation is incredible! I wish more websites were like that.
The contrast is so bad I simply can't look at it. The flickering that happens when you click something is quite annoying and disorientating. It's a shame because this looks like a really nice font that's easy on the eyes.
[deleted]
so sexy and non attention seeking but simple... trying it out. Fira Code is my main.
> Use keyboard to control website
No thank you
No thank you
Good stuff.
Commit Mono, hmm? I like it.
Thank you for this memorandum, and especially for "no confusing ligatures".