I've installed iceberg theme extension on vscode, and spend decent amount of time to figure out how to change the color of line number in the way to be the same like code section background color. What I have
I want something like in dark+ (default dark) where both sections have same color
What I would like to have
Is it possible to override only line number column color?
You can add these to your settings.json:
"workbench.colorCustomizations": {
"editorLineNumber.froeground": ,
"editorGutter.background": ,
"editorCursor.foreground": ,
},
Choose the color you like and save the changes. Hope hepful.
there are 2 workbench colors for line numbers
editorLineNumber.foreground
editorLineNumber.activeForeground
Set both color names to the same color in your settings.json file specific for this theme.
After some more searching I found editorGutter.background responsible for setting that thing
Related
Editing Python source in VSCode, I notice some color themes highlight use of {braces like this} in non-f-strings. Others don't.
Such highlighting is useful - it often marks error where the string was supposed be an f-string but isn't.
The "Dark+ (default dark)" theme looks like this:
The "Dark (Visual Studio)" theme looks like this (same color for plain string and brace):
How can I change the highlight color for {foo2} in the color theme? I want to make it much more prominent so I'll notice it.
I think changing this requires something in editor.tokenColorCustomizations in settings.json, but what setting in there corresponds to the {foo2} syntax?
I have checked the Official Doc about theme settings, after trying too many times, I haven't made it. I want to change the text color(not background color, just the words color), which profile should I edit?
I have spended a few time and solved it. Edit your settings.json as below:
"workbench.colorCustomizations": {
"list.focusForeground": "#00ff00",
},
Replace the color(hex) as what you want, the example code color #00ff00 is green.
BTW, how I get this settings:
Toggle developer tools(In vscode dropmenu of help)
Try to find div where you want change, and get the color, for example (#eeffff)
command + shift + p, and input Generate Color ... will show Generate Color Theme From Current Settings, select it would open a new file with full color configs.
copy all colors json code block to settings file which match key of workbench.colorCustomizations
search #eeffff and try to find relative key, if not sure, change color and try to see the color in your code.
find out list.focusForeground is right. And keep this settings, remove other.
It might spend less or more time, but it works.
I couldn't find a solution so I ask a new question for this.
I need to change the color of my error messages in visual studio code.
The problem is that the text color of the error message doesn't have enough contrast. Unfortunately I can't find out what I need to change in my settings.json. I was looking for something like:
"workbench.colorCustomizations" : {
"terminalCursor.errorColorFont" : "#ffffff"
}
Thanks for your help!
Same problem here. This worked for me.
"workbench.colorCustomizations" : {
"terminal.ansiRed": "#f88"
}
The following setting helped me:
Terminal › Integrated: Minimum Contrast Ratio
When set the foreground color of each cell will change to try meet the
contrast ratio specified. Example values:
1: The default, do nothing.
4.5: WCAG AA compliance (minimum).
7: WCAG AAA compliance (enhanced).
21: White on black or black on white.
I changed the value to 7 and the dark red became a coral color with good contrast. The advantage of this is it will also apply to other low-contrast background/foreground combinations.
The best solution to this problem is go to settings type "color custo" go to appearance select settings.json file under "workbench.colorCustomizations" paste the following key : value as shown
//"terminal.background":"#000000",
"terminal.foreground":"#10e92d",
"terminalCursor.background ":"#E0E0E0",
"terminalCursor.foreground":"#E0E0E0",
"terminal.ansiBlack":"#000000",
"terminal.ansiBlue":"#6FB3D2",
"terminal.ansiBrightBlack":"#e41c1c",
"terminal.ansiBrightBlue":"#6FB3D2",
"terminal.ansiBrightCyan":"#76C7B7",
"terminal.ansiBrightGreen":"#A1C659",
"terminal.ansiBrightMagenta":"#D381C3",
"terminal.ansiBrightRed":"#FB0120",
"terminal.ansiBrightWhite":"#FFFFFF",
"terminal.ansiBrightYellow":"#FDA331",
"terminal.ansiCyan":"#76C7B7",
"terminal.ansiGreen":"#A1C659",
"terminal.ansiMagenta":"#D381C3",
"terminal.ansiRed":"#FB0120",
"terminal.ansiWhite":"#E0E0E0",
"terminal.ansiYellow":"#FDA331"
I hope this will meet your requirements.
I am using Cobalt2 theme in VS Code which is perfect for me. There is only one issue that I have with this theme, that would make me try changing it. Its the color of params in terminal, which is a dark blue on black - very hard to see. Does anyone know how to change this? What this element is called in a custom theme? Thanks for your help.
A small screenshot of what I mean:
Examples: gulp serve --config, ng serve --port ...
Its about the --params and their color
This is an easy way to customize the text colors of the integrated terminal in VSCode, so there's no need to change the theme itself. You can simply overwrite the default colors.
Just add this line to your settings.json:
"terminal.integrated.drawBoldTextInBrightColors": false
Then you'll be able to overwrite the default colors and change them to the colors you want to see instead:
"workbench.colorCustomizations": {
"terminal.ansiBlack": "#50ff00", //this overwrites black colors with green
"terminal.ansiBlue": "#ff0000", //this overwrites blue colors with red
...
}
Let's say you want to change the terminals black colors into another one (for example green), you'll have to asign "#50ff00" to "terminal.ansiBlack". As you can see below, there are a few more colors you can change (make use of IntelliSense).
It should look like this:
I'm trying to change the color of a current line in a debugging mode.
So, I know how to change color in general, but don't know what is the name of the parameter.
for example, to change a selected line we need "editor.lineHighlightBackground"
"workbench.colorCustomizations": {
"[Base16 Dark Oceanic Next]": {
"editor.lineHighlightBackground": "#ff0000",
}
}
but, how to change the line color which appears during debugging?
Write the customization without "[Base16 Dark Oceanic Next]" as :
"workbench.colorCustomizations": {
"editor.lineHighlightBackground": "#ff0000",
}
For anyone interested in how to do this in Tools > Options > Environment > Fonts and Colors.... Change the background color for the Text Editor > Display Item called "Current Statement."
If editor.lineHighlightBackground doesn't do what you want, try editor.stackFrameHighlightBackground.