vscode change font-family only for font ligatures - visual-studio-code

in vscode I am trying to change font family only for font ligatures to Fira Code. I can do it with custom css plugin, but the class for font ligatures (.mtk10) is shared. So if i change it, then it also changes font for if, else, this and other keywords. Is there any way to target only font ligatures?
This is my custom css style:
.mtk10 {
font-family: Fira Code;
}

I would not recommend that at all. You can, however, edit your own font and add ligatures inside that. Check this tutorial on how to create a font with ligatures.
You can also check out this October 2019 Release Notes - stylistic sets.
If you'd rather setup ligatures with Fira Code and use that font as well, then you can do that by the following set of instructions.
Step #1: Install Fira Code.
Step #2: Set the font in VSCode settings:
"editor.fontFamily": "Fira Code, Menlo, Monaco, 'Courier New', monospace",
"editor.fontLigatures": true,
Step #3: Restart/reload VSCode.
That's about it.

Related

Turn off ligatures in Flutter

I would like to turn off the font ligatures for a text. I use the Fira Code font, but I can't find a way to turn off the ligatures in TextStyle in my app.
Can anyone help me?
When you use a Text widget, you can enable or disable various FontFeatures via its TextStyle. Looking at Fira Code in https://wakamaifondue.com/, it appears ligatures are controlled by the calt feature, which is enabled by default. You therefore could try disabling that:
Text(
someString,
style: TextStyle(fontFeatures: [FontFeature.disable('calt')]),
)
Alternatively, Fira Code is open-source and has build options to enable or disable features in the generated font files.

Why does my terminal in VS Code have weird spacing and how can I fix it?

This is what my settings is looking like:
This is the weird spacing between letters in terminal:
Why is the font on my VS Code's terminal have this weird spacing between letters? It is really bugging me and I tried to change the font in the settings to a monospace font (inconsolata), but that hasn't worked.
I think those big spaces between the characters comes from your exotic chosen font (Inconsolata). So change only "terminal.integrated.fontFamily": "Inconsolata" back to the default font:
"terminal.integrated.fontFamily": "Monaco"
And look, to need the double-quote, and not some triple quote like in your screenshot!
This usually happens when the chosen font is not installed on your system. Try to revert the font settings by removing or commenting these two lines:
"terminal.integrated.fontFamily": "Inconsolata"
"Editor.fontFamily": "Source Code pro"
The default font is usually the default monospace font of your system.
VS Code only accepts unicode fonts.
Try to setup:
"terminal.integrated.fontFamily": "monospace"
Using "MesloLGS Nerd Font Mono 11" as the integrated terminal family font fixed this issue.
Don't forget to make sure it is the integrated terminal family font you're setting and not the editor's family font.

Markdown Preview in VS Code doesn't disable font ligatures

I am using the font "Cascadia Code" as my default font in Visual Studio Code. I don't want font ligatures in my editor. By default, "editor.fontLigatures": false is set, which means font ligatures are disabled by default in Visual Studio Code, and it works, I see no font ligatures in my code. But the problem is, when I am working on a markdown file, which contains code blocks, the source code doesn't show font ligatures, but when I preview the markdown file, I found font ligatures in the preview. Then I explicitly set "editor.fontLigatures": false in my User settings.json. Even then, I see those font ligatures in markdown are still appearing. How do I stop that ?
Changing the font to a font which doesn't support font ligatures doesn't show ligatures in markdown preview, but I want just Cascadia Code. Is changing the font only way ?
Visual Studio Code Version: 1.58.2
Operating System: Ubuntu 20.04 Desktop LTS

Why my new font is not used and why coming back to my old one does not work anymore?

I was using Fira Code and wanted to try the new MS font called Cascadia. For some reason VS Code did not apply that new font and put a default ugly one.
Then, I put back Fira Code, but for some weird reason, even that one was no more applied!
I tried to reinstall VS Code, but did not solve my problem.
Any suggestions for me?
Running VS Code 1.38.1
Thanks
Not sure to fully understood what happened, but now it is working.
First, I changed user and workspace font family to Consolas, 'Courier New', monospace
Then, I did: Cascadia, 'Fira Code', Consolas, 'Courier New', monospace
Working good now.

"default" font they use for Visual Studio Code?

I don't actually mean the default font they use on the editor, but the font that appear in the images on the site itself.
For example this one:
https://i.imgur.com/71UX5tU.jpg
https://code.visualstudio.com/images/1_14_js-refactoring.gif
It's not Consolas or Menlo because of how it renders the "g". I'm just trying to get that exact same look on Windows, but I can't find a good match.
It is virtually impossible to know which font they are using unless they explicitly say. I do not know of any place where they do.
Within the stock version of VS Code, unless you specify otherwise in settings.json, the default font priority is: Consolas, Courier New, and then monospace.
According to the Default Settings pane of settings.json:
// Controls the font family.
"editor.fontFamily": "Consolas, 'Courier New', monospace",