Best Programming Fonts (2024)
HTML-код
- Опубликовано: 5 авг 2024
- A detailed guide on setting up font family and font ligatures in Visual Studio Code, along with an overview of a few fantastic programming fonts you should try out. You’ll learn how to easily experiment and try out different coding fonts to find your perfect font and how to solve a major gotcha related to font ligatures.
🔗 Links
Coding Fonts Playground: cssw.io/coding-fonts
GitHub Monaspace Font: cssw.io/monaspace
Subscribe to CSS Weekly Newsletter:
💌 css-weekly.com/
Help support my channel
👨🎓 Get a course: masteringlinting.com/
🪧 Buy a CSS sticker pack: stickers.css-weekly.com
💖 Support me on Patreon: / cssweekly
Keep up-to-date with CSS Weekly:
🐦 Twitter: / @cssweekly
🎶 TikTok: / cssweekly
🎇 Instagram: / cssweekly
📘 Facebook: / cssweekly
Keep up to date with what I'm up to:
👨💼 Blog: zoranjambor.com
💼 LinkedIn: / zoranjambor
📖 Chapters
00:00 Why you should find a good coding font
00:28 How to change font family in VS Code
01:13 How to enable ligatures in VS code
02:04 What are font ligatures
02:54 How to find a good programming font
03:47 JetBrains Mono Font
04:05 Cascadia Code Font
04:37 Iosevka Font
05:05 How to inspect font variations on MacOS in Font Book
05:46 Using font variations in VS Code
06:31 Fira Code Font
06:48 GitHub Monaspace Font
07:37 What if font ligatures are not working in VS Code
08:48 What is your favorite coding font?
- Zoran Jambor
#codingfonts #vscode 
Наука
I had not heard of this source. I just installed it and it is fantastic. Thanks you so much!
I'm so glad to hear this, Patas! Thanks for watching and commenting! 🙂
Nice channel.
Thanks!
Thanks so much! It means a lot! 🙏
Thanks nice Video!
Thank *you* for watching and commenting! 🙏
Nice collection of fonts. Btw what's your vs code theme?
Thanks, Ashish! In the video, I'm using "Community Material Theme Palenight High Contrast" 🙂
I go over my favorite themes in this video, in case you want to check it out: ruclips.net/video/C_pn9hS8GuY/видео.html
Cascadia Code is my go-to font!
Yes, Cascadia Code, is fantastic! Thanks for sharing your choice, Phúc! 🙂
Thank you.
Thank you, İsmail, for watching and commenting! 🙏
Thank you Kevin for sharing!
Kevin as in Kevin Powell? 🙂
@@CSSWeekly Yep!
As in a compliment or a critique? 🙂
@@CSSWeekly Neither. Rather just saying in his newsletter that ... "I somehow missed this one when Zoran posted it, but it's a great video that takes a look at how to find a good font for your editor, ..."
@@CSSWeekly Great video btw. No doubt.
On a related note, can anyone tell us how to default to tab indenting for every file I open in VS Code? It’s exhausting to have to change from spaces to tabs every time we create a new file.
Of course, Larry! Try setting the "editor.insertSpaces" option to false. 🙂
In JSON: "editor.insertSpaces": false
Or in GUI: cln.sh/rS0W0kTN
I hope it helps. 🙂
Love the product icons❤. which one is it please?
Thanks so much! 🙏
This is the Fluent Icons theme: marketplace.visualstudio.com/items?itemName=miguelsolorio.fluent-icons
I've also gone through my favorite product icon themes in this video, in case you want to check it out: ruclips.net/video/aLCzInfPqo8/видео.html 🙂
I hardly notice my coding font.
And I use Sublime Text. So the interesting configs shown probably won't apply to me anyway.
I think I only really notice the font when it's bad, meaning it is distracting or difficult to read. 🙂
Sublime Text options probably work a bit differently, but principles should be similar! Thanks for commenting and watching, Dan! 🙏
your user settings seems very good, can you share that complete user setting json code ?
Thank you! Sure thing, I've added them to a Gist here: gist.github.com/ZoranJambor/d1eb94def553d1abe8bcfa5d4c163e6a
And I'm also planning to make a video on setting up VS Code from scratch. Is this something you'd want to watch? 🙂
yes
@@CSSWeekly
Awesome! 🤩
I have used Jetbrain mono for almost 2 years now
Yes, that's a fantastic choice! 🙂
I tried it and it was almost perfect, i just didn't like the ligatures.
IBM Plex is super for me in my Terminal environment!
Good choice! I've never really used it, but I'm looking at it now and it does look really good! 🙂
Thanks for sharing this! 🙏
@@CSSWeekly Ah! Thanks for appreciating!
Though I don't think it supports ligatures, however. But very sharp and modern looking nonetheless. I feel like this font has a sort of room to breathe effect.
You're right; it doesn't support ligatures. So it's a no for me, but it still looks clear and readable, which is the most important thing. I guess that's due to the "breathe effect" you mentioned. 🙂
I currently stick to JetBrains Mono since a couple of years.
A fantastic choice! Obviously. 🙂
Addendum: ... after I've tried or used a couple of other ones, esp Fira Code.
Sure! It's a good idea to shop around. 🙂
Mono all the way... which makes sense to me as I use Jet Brains products
Indeed, JetBrains Mono is a great choice! And I guess the same goes for their products. 🙂
I keep switching between Cascadia Code NF and JetBrainsMono Nerd Font. I really like SpaceMono and VictorMono, just not use to these.
These are all great choices-thank you so much for sharing this, Abdul! I wasn't even aware of the Nerd Fonts! 😳
Don't forget about Dank Mono. Still one of my favs
Thanks for sharing it! It seems quite nice! And the license seems more than affordable. 🙂
0:36 It's "ctrl + , " for WINDOWS MUDDAFUGGAS
Yes, it is! Thanks for confirming it, Tommy! 🙂
I should probably do a better job of noting Windows alternatives. I just assume that people know by now that CMD is usually CTRL on Windows. 😕
I use monolisa
Oh, that's a nice one, Sonu! It's really good to see that people appreciate premium fonts! 🙂
Space Mono👍
I haven't heard about this one. It certainly is unique, but a bit too space-ish for me. 🙂
Thanks so much for sharing it, Awan! 🙏
Have used all fonts in this video but have to say Maple MonoNF is the best
Oh, I haven't heard about Maple Mono. Thanks for sharing it, Devang. It really is nice. 🙂
@@CSSWeekly Believe me it is super cool to use and I am actively using it in my dev workflow
I believe you. 🙂
And I’ll probably feature it on the next fonts video. 🙂
👍👍👍👍👍
🙏🙏🙏
I use red hat mono
Nice one! Thanks for sharing it! 🙂
Are you primarily using Linux for development? Or is this just a coincidence? 🙂
@@CSSWeekly I use Linux for everything (since 2018).
That's great! 🙂
Can I ask if you ever experience any specific challenges related to OS when it comes to web dev?
Roboto Mono
I love the entire Roboto family, but I never really used Roboto Mono in my code editor. I do use it in code screenshots and video thumbnails, though! 🙂
Cascadia Code
That's a fantastic choice! 🙌
@@CSSWeekly True!🙌🏻
Also, there's a repo on GitHub on how to make any font to have ligatures. Could you please make a tutorial on that?
I didn't know this is possible without digging into font files and creating new glyph. 😳
Do you have a link to the repo?
consolas
Consolas is a really good choice, Ștefan! I think I used it for a while a few years back. 🙂
Jetbrains Mono all the way using it on my editors and terminal
An excellent choice! Thanks for sharing and reminding me that I should check my terminal font! 🙂
im still using hack... a bit tired of it, but theres nothing better around for me
Hack is a great choice! 🙂
I often find myself shopping around for a new color theme only to realize I want to keep my current one. 🙂
@@CSSWeekly yep. Theme hits even more than fonts imo. I use gruvbox since times immemorial to keep my eyes happy.
Oh, I wasn't familiar with Gruvbox. It looks great; thanks for sharing it! 🙂
My favorite is CommitMono.
I haven't heard about CommitMono. It seems nice, and their website concept is fantastic! 🙂
Thanks for sharing it! 🙏
@@CSSWeekly You’re welcome. Yes, the website is a marvel! However, navigating with the keyboard takes some getting used to.
Thanks for that, first time I hear about it as well, very nice! And even if I didn't like the font, just navigating through the website is a real treat!
Indeed, the keyboard navigation is superb, and it helps in showcasing the font. 🙂
Great font. Thanks for sharing it!