Support fontName in textMateRules

[klippx]

This is a feature request, and I am not sure how it will be received. Probably not overwhelmingly positive, but nonetheless:

I would like to have support to change font family in my textmate theme. Right now you support fontStyle, fontSize and foreground. I believe the correct term is fontName as per textmate/markdown.tmbundle#7 which would control the css font-family property,

E g something like

  "editor": {
    "fontFamily": "Fira Code",
    "fontSize": "16",
    "tokenColorCustomizations": {
      "textMateRules": [
        {
          "name": "Variables",
          "scope": "variable",
          "settings": {
            "fontName": "Script12 BT",
          }
        }
      ]
    }
  }

This would be in order to conditionally change font-family and be able to support more creative themes.

[mike-lischke]

. o O (seems odd to allow fontName in a section named tokenColorCustomizations)

[nergnezor]

fontStyle is already available there

[psgganesh]

Here it is !

https://gist.github.com/psgganesh/d0815ece4b19ce24dde98e21d55f53f5, works for me

[ChristinWhite]

letter-spacing is also extremely helpful when working with multiple fonts so you can adjust to consistent size of characters and then tweak the spacing to make sure columns line up as closely as possible. It worked really nicely in Atom before I switched to VSC.

[lhttjdr]

It's a very useful feature for CJK comments, because it's very strange to change CJK characters into italic style or bold style.
I think it is a common problem for all languages with non-alphanumeric characters. If I just change its style a little, either the characters becomes hard-to-read (ie. italic style), or the difference is is too small to be easily distinguished (ie. bold style).

[rolandleth]

Any chance this gets on the radar? Would be super awesome to have it.

[giodestone]

Any progress on this feature?

[bahmanashtari]

Just checking for any possible changes?

[douknow]

I need this feature too, and I think also need fontSize, letterSpace, and baselineOffset attributes for aligning different font in the same line.

[Saucistophe]

I wanted a custom font for comments, and after browsing for a few hours (Yes, I do want cursive comments) it seems one is left with three options:

• Lay out 200$ to install Operator Mono which, when you think about is, is kind of a hack;
• Use Custom CSS and JS loader extension, let it run your VS Code as a privileged user to alter your files (Which in my book is yuck);
• Wait for this feature request.

I'm not rich, I'm not running things as root, so any progress? 😄
I'm eager to contribute/document/test/whatever.
Edit: I'm experimenting with this.

[markpanado]

I need this 🙏

[vkiss]

This feature would be great

[lavfilip]

Need it as well

[maciejmatczak]

fontSize could make markdown representation possible directly in editor, right? Typora like preview.

I am not sure what units can be used there, it should be those based on "standard" size, header level 3 being 1.1 times bigger, etc...

[ChristinWhite]

Wow, opened in 2017 and here we still are, this sure would be nice.

[ghost]

Wow, opened in 2017 and here we still are, this sure would be nice.

It seems like microsoft are doing the same thing they do with teams, except here they aren't even saying "we'll work on it!". They're just not doing it. If it's been 3 years and no support it's down to the community to build either an extension or library.

Why make useful updates that focus on UX when you can fix a bug that requires a ridiculous setup to actually encounter?

[ChristinWhite]

Hmm, I‘m not sure I'd call this a bug, more a feature request but it doesn't really matter. Would this even be possible for an extension to implement? I haven't been into the APIs but I haven't seen anything that modifies the editor that way.

Maybe some use-cases would help this seem a little less obscure.

The main one for me is working with Markdown files, it would be nice to have markdown files use a non-monospace font but still shift to monospace for inline code and code fencing. It's not that big of a deal for random markdown pages most of us run into from time to time but there's an increasing number of users using Visual Studio Code as their full-time notes manager and are building out extensions around that use. Markdown Notes, Foam and Dendron, for example.

Still probably an edge-case but a growing one.

[rahulkp220]

Looking forward to this.

[ThePython10110]

Would be nice.

[zadamg]

so to be clear... is it not possible to set custom font-families for class or function names in our code? (language dependent)

I'm trying to see if I can or can't do that... this thread tells me "no", unless there's a hacky css way?

[klippx]

For me the goal was to get different fonts for italics, similar to operator mono. But I think that goal can be solved in a good way on a font level: There are examples of fonts that mix/bundle different fonts together in a pleasing way.

Some examples:

• https://github.com/microsoft/cascadia-code
• https://github.com/dqisme/Hactor

Since I am happy and this issue is 5 years old I might as well close it unless someone screams?

[Saucistophe]

I had my 2 cts for future reference.
You can make VS code switch fonts using a kludge: https://dev.to/kunaltanwar/how-to-customize-and-combine-2-fonts-in-vs-code-50mi
And I tried many fonts with cursive italics, and settled with the excellent Cartograph CF, even though it costs 50 $.

[peter-fb]

Your first comment has received 124 likes and 22 hearts, so the demand is there for this bug/feature request and it would be a pity if you'd close it.

[dlschmidt]

Wouldn't this feature have to be implemented in Monaco first?

[billchen2k]

It's been 5 years and Microsoft still hasn't provided support for this feature. I find it hard to believe that injecting custom CSS for different tokens within the editor is technically challenging, as it's essentially just a web page. What's been holding back Microsoft engineers for so long?

[silopolis]

Keeping faith, I'll join the mob begging for this, specially seconding @maciejmatczak and @ChristinWhite comments, this would be a significant improvement for all people writing formatted text in VS Code… Which I believe is a growing crowd!

Thanks in advance for (finally) considering (someday, maybe)

[0nyr]

I'm taking part to the mob. This would be awesome... So sad it's been laying there for so long...

[lopugit]

bruh we NEED different font sizes for const, let, var and variable = statements, to make it easier to identifier variable assignments in a file, right now it's just a wall of text..

[dlschmidt]

My first usage of this feature would be prettier markdown editing by giving headlines actually a bigger font size

[starball5]

Related on Stack Overflow:

• Is it possible to have multiple different font families based on syntax highlighting tokens/scopes in VS Code?
• Any way to change the font family of only commented code in VSCode?
• How to change font size of specific parts of code in vscode?

[marvinruder]

When GitHub Next released their font family Monaspace today with this example setup, I wanted to reproduce it in VS Code:

Unfortunately, this is not yet possible, so I would really like this issue to be implemented soon.

[tudor]

Joining the train of people who installed Monaspace and now can't live without this feature :)

[vuon9]

In what way can GitHub showcase a nonexistent thing?

[tudor]

@vuon9 In a (simulated, Photoshopped) screenshot (see above, in this thread) that shows what it would look like, and it would be beautiful.

[TZECHIN6]

how to set different font style using monaspace in vscode, might be I have missed the tutorial... but I really cant find how to correctly set the user.setting.json

[0nyr]

@TZECHIN6 I think what you are looking for, is to add the following lines in your VSCode config settings.json:

    "editor.fontFamily": "'CustomJetBrainsMonoNFFantasqueSansMNF', 'JetBrainsMono Nerd Font', 'FiraCode Nerd Font Mono', monospace",
    "editor.fontLigatures": true,
    "editor.tokenColorCustomizations": {
        "textMateRules": [
            {
                "scope": "comment",
                "settings": {
                    "fontStyle": "italic"
                }
            }
        ]
    },
    "python.testing.pytestEnabled": true,

You can have a look at my personal VSCode config in my dotfiles for context

[TZECHIN6]

@TZECHIN6 I think what you are looking for, is to add the following lines in your VSCode config settings.json:

    "editor.fontFamily": "'CustomJetBrainsMonoNFFantasqueSansMNF', 'JetBrainsMono Nerd Font', 'FiraCode Nerd Font Mono', monospace",
    "editor.fontLigatures": true,
    "editor.tokenColorCustomizations": {
        "textMateRules": [
            {
                "scope": "comment",
                "settings": {
                    "fontStyle": "italic"
                }
            }
        ]
    },
    "python.testing.pytestEnabled": true,

You can have a look at my personal VSCode config in my dotfiles for context

Thanks for your reply, but what I really want is to use different font type in different session like Monaspace Neon for code, and Monaspace Radon for comment

[0nyr]

It's not possible using the settings.json or any options of VSCode, hence this long-awaited issue.

What I'm doing here, is that I have forged my own font, as a cheat, where the normal and italic font are actually different fonts. Go check that for details.

Yes... it's painful to do. We are all hoping for that feature to be release some day.

[kosirm]

+1

[owenblacker]

Another +1 for the ability to set different font names for different code aspects, like the “code in Monaspace Neon, comments in Monaspace Radon, docstrings in Monaspace Xenon, CodePilot suggestions in Monaspace Krypton” example in the What if? section on the Monaspace website, as @marvinruder commented above