Shulou(Shulou.com)06/01 Report--

This article shows you how to customize the theme and code color of VSCode, the content is concise and easy to understand, it can definitely brighten your eyes. I hope you can get something through the detailed introduction of this article.

In the lower left corner of VS Code, click Settings.

After turning on the settings, search for keywords: topic in the search bar.

The search results show that there are many edits in setting.json, and you can edit the color of the code by opening one at any point.

After the code in the file setting.json, insert the appropriate code, and then save it.

The code is as follows:

/ / Custom color "editor.tokenColorCustomizations": {"comments": "# 55aa7f", / / comment "keywords": "# ff55ff", / / keyword "variables": "# a792e2", / / variable name "strings": "# 00ff7f", / / string "functions": "# ffff00" / / built-in function name "numbers": "# 00eeff", / / numeric "types": "# 55bbff", / / Class definition color}

You will find that the color of the code in the editor has changed.

Found that the color of quotation marks, still do not like, so look for a long time information, continue to toss about.

/ / the code behind the text matching rule overrides the previous color setting code.

/ / Custom color "editor.tokenColorCustomizations": {"comments": "# 55aa7f", / / Note "keywords": "# ff55ff", / / keyword "variables": "# 5eccf8", / / variable name function parameter name "strings": "# 00ff7f", / / string "functions": "# ffbb00" / / Custom and built-in function names such as: print "numbers": "# 00eeff", / / numeric "types": "# 55bbff", / / Class definition color / / text matching rules "textMateRules": [/ / entity.name.function ", / / directly called function / / entity.name.type" / / variables defined by typedef / / keyword.control ", / / if switch break return / / keyword.operator.assignment", / / = equal sign / assignment sign | = & / / "keyword.operator.logical" / / logical symbol & & | |! / / "constant.character.escape", / / "\ r\ n"\ / / constant.other.placeholder ", / /"% s% c "/ / punctuation.definition.comment", / * the beginning of the comment / / constant.numeric " / / number: part 20 of 50 10 0x20 / / keyword.operator.word / / and or not / / "scope": "meta", / / parentheses called by parentheses declared by the function. / / punctuation.separator " / / colon comma / punctuation.terminator ", / / semicolon / / storage.modifier", / / static const / / string.quoted.single ", / / single quote string / / string.quoted.double" / / A double quotation mark string / / string.quoted.triple ", / / triple quote string / /" storage.type ", / / void int char / /" punctuation.definition.string.begin ", / / left double quotation mark / /" punctuation.definition.string.end " / / right double quotation marks / the color of the function name built into the system, such as: print len {"scope": "support.function" "settings": {"foreground": "# ffbb00",}}, / / the name color of the class is like abc {"scope": "entity.name.type" in class abc () / / function and class name color "settings": {"foreground": "# 14fff3",}}, / / definition word color of class and function def class {"scope": "storage.type" / / void int char "settings": {"foreground": "# ff00c8",}}, / / I don't know what {"scope": "storage.modifier" / / static const "settings": {"foreground": "# ffe600de",}}, / / Operation symbol For example, +-* / = {"scope": "keyword.operator", / / = equal sign / assignment sign | = & = "settings": {"foreground": "# ff55ff",}} / / system control keywords: such as if pass return f {"scope": "keyword.control", / / if switch break return "settings": {"foreground": "# ff00c8", "fontStyle": ""}} / / logical symbols: such as and or {"scope": "keyword.operator.logical", / / logical symbols & & | |! "settings": {"foreground": "# ff00c8", "fontStyle": ""}}, / / newline characters, escape characters, such as:\ r\ n {"scope": "constant.character.escape" / / "\ r\ n"settings": {"foreground": "# ee5050", "fontStyle": ""}}, / / I don't know what {"scope": "variable.other" / / "settings" such as structure objects and members: {/ / VSCode uses C color restrictions This compares to "foreground": "# 4f1eff", / / such as Public.Delay (). The color becomes "fontStyle" together: "" / / the display colors of Public and Delay cannot be set separately. / / probably because VS Code is mainly used in the front end. Support for C is not perfect}, / / function parameter name {"scope": "variable.parameter", / / function parameter-definition phase "settings": {"foreground": "# 5eccf8" "fontStyle": ""}}, {"scope": "entity.name.section", / / function parameters-call phase "settings": {"foreground": "# ff0000" "fontStyle": ""}}, / / left single and double quotes {"scope": "punctuation.definition.string.begin", "settings": {"foreground": "# 00ff7f" "fontStyle": "bold"}}, / / right single and double quotes {"scope": "punctuation.definition.string.end", "settings": {"foreground": "# 00ff7f" "fontStyle": "bold" / / bold}}, {"scope": ["constant.other.symbol",] "settings": {"foreground": "# ff0000"}]}. This is how VSCode customizes the theme and code colors. Have you learned any knowledge or skills? If you want to learn more skills or enrich your knowledge reserve, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.