How does Vscode modify the editor color scheme__Vscode method to modify the editor color scheme

Troubled by the default color scheme of the VSCode editor? PHP editor Youzi brings you a detailed tutorial on color modification, guiding you step by step to create a personalized editor interface. From understanding color settings to customizing color schemes, this guide will provide you with comprehensive guidance.

1. First of all, what you have to do is to know what basic type the code you want to modify belongs to. You can move the cursor to a piece of code you want to change the color, such as moving the cursor to a string.

2. Then, run the [Inspect TM Scopes] command in the command panel.

3. At this time, a new floating window appears in the editor. What is presented in this window is the language, syntax type, current color and background color corresponding to the current code snippet.

4. For example, in the picture above, this window displays the following information:

The current token is hello, and its type is String.

Its color is #ce9178ff and its background color is #1e1e1eff.

The syntax scopes it belongs to are string.quoted.double.js, meta.var.expr.js, and source.js from the inside out.

5. Then if you want to turn all strings into red, then you need to modify the color of the String scope. Next, you can open the personal settings (JSON) again and enter editor.tokenColorCustomizations.

6. Then put the cursor into this JSON object, press [Ctrl Space] to trigger the suggestion list, and you will be able to see the following suggestions.

7. The first thing that appears in the suggestion list is the name of all the themes you can use in VS Code. By selecting them, you can override only a certain color within a theme. Here you can scroll through the list to see what other suggestions are below.

You can see the following options:

comments represents the color of comments.

functions represents the cold color of the function.

keywords represents the color of keywords.

numbers represents the color of the numbers.

strings represents the color of the string.

types represents the color of the type.

variables represents the color of the variable.

textMateRules I will introduce them below.

To change the color of a string, you just select the strings and change it to red, that is:

"editor.tokenColorCustomizations": { "strings": "# FF0000", }

8. After finally saving the settings, when you return to the JavaScript file just now, you can see that the string colors have changed.

The above is the detailed content of How does Vscode modify the editor color scheme__Vscode method to modify the editor color scheme. For more information, please follow other related articles on the PHP Chinese website!