Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.3k views
in Technique[技术] by (71.8m points)

vscode settings - How do I change font of comments in visual studio code?

After watching a Sublime3 screencast by a famous python programmer, I found that display code comment in a fancy font is a great idea, which let comment more distinguishable and makes comment reading more pleasant. One example is like below:

sublime text 3 screencast

In this demo, code comment is shown in a light color hand-written like font, making it easier to be distinguished from the real code and keeping the comment fun to read at the same time.

I went through https://code.visualstudio.com/docs/getstarted/ but can't seem to find the setting for changing the comment font for code.

So I am wondering how to set a another font for comment against normal code font.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

Download font https://www.dafontfree.net/freefonts-script12-bt-f141942.htm

Install package https://github.com/be5invis/vscode-custom-css

Create new css file sudo nano ~/.vscode/vs-code-styles.css

Copy CSS

/* Set italics and comments to the script font */
.mtk3, .mtk4 {
    font-family: 'Script12 BT';
    font-size: 1.2em;
    font-style: normal;
    color: #57a649!important;
}
.comment {
  font-family: 'Script12 BT';
  font-style: italic;
  font-size: 1.2em;
  color: #57a649!important;
}
.comment:not(.punctuation) {
    font-family: 'Script12 BT';
    font-size: 1.5em;
    color: #57a649!important;
}

Code > Preferences > User Settings

// Somewhere in your user / workspace settings file !

.
.
.
.

"vscode_custom_css.imports": ["file:///<PATH TO CSS FILE>/.vscode/vs-code-styles.css"],
"vscode_custom_css.policy": true,
"editor.tokenColorCustomizations": {
    "textMateRules": [
        {
            "scope": "comment",
            "settings": {
                "fontStyle": "italic"
            }
        }
    ]
}

Source: https://gist.github.com/psgganesh/d0815ece4b19ce24dde98e21d55f53f5


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...