In VS Code, I want to change the colors of text for my theme. I want to change the color that VS Code makes edited files. I have tried
"workbench.colorCustomizations": {
"[Monokai]": {
"editorOverviewRuler.modifiedForeground": "#ff0000",
"editorOverviewRuler.warningForeground": "#ff0000"
}
}
per the documentation, but that doesn't do anything, and I can't find any other parameters that woulda affect the color specific to files that have been edited and not yet saved or committed to GIT. I do know it can be changed, because that color is different between Monokai and Monokai Alt.
Can anyone help? The color manipulation of this IDE is beyond frustrating.
Alex game me the answer ...
"workbench.colorCustomizations": {
"[Monokai]": {
"gitDecoration.modifiedResourceForeground" : "#ff0000"
}
}
#ff0000 being the color edited files are now marked as in the browser tab
Related
I'm using Monokai Pro as my color scheme in VS Code. When VS Code greys out the names of the folders that are found in the .gitignore file, the text color becomes incredibly difficult to read.
For example, I had the /node_modules folder (circled in red) written inside my .gitignore file and VS Code would grey out the node_modules text in the Explorer.
When I expand the folder, all the sub-folders' names are greyed out but the text is very difficult to read.
I would like to edit the color of the greyed out file names inside the VS Code JSON settings. I'm aware that I can make customizations to a color scheme as found in the documentation here. However, I'm not sure which JSON property targets the greyed out file names inside Explorer.
"workbench.colorCustomizations": {
"[Monokai Pro]": {
// What should I write here?
}
}
It looks like this is the one:
"gitDecoration.ignoredResourceForeground": "#ff0000"
so
"workbench.colorCustomizations": {
"[Monokai Pro]": {
"gitDecoration.ignoredResourceForeground": "#ff0000"
}
}
In the explorer sidebar, if the file has no errors then the colour is green, if the file has errors it turns red. Is there a way to change the colours for when there are errors?
I believe what you're looking for is to add the following setting into your settings.json:
{
"workbench.colorCustomizations": {
"gitDecoration.conflictingResourceForeground": "#00AA00"
}
}
You can find more info about changing colors to certain elements (specifically git related elements) here in the offical VSCode documentaiton - https://code.visualstudio.com/api/references/theme-color#git-colors
I am not a huge fan of the peach color in the explorer for modified files. Searching through the color theme reference I can't seem to find an override..
https://code.visualstudio.com/docs/getstarted/theme-color-reference
I've even tried disabling extensions and I am still seeing those predefined colors.. I am using the Monokai Soda theme but that doesn't seem to be what is setting those colors in the sidebar..
Any help appreciated - it's kinda driving me crazy..
ANSWER
Needed a combo of error style and git overrides, see answer below:
"workbench.colorCustomizations": {
"list.errorForeground": "#b3e5ec",
"list.warningForeground": "#00d9ff",
"gitDecoration.modifiedResourceForeground": "#00ffb3",
"gitDecoration.untrackedResourceForeground": "#f7aeae"
}
Turns out that the colour you're seeing isn't due to modified content. It's due to having problems/errors in your file. If you hover over the file name you should see x problems detected in this file.
To change the colour of those, you can use
"workbench.colorCustomizations": {
"list.errorForeground": "#00AA00"
}
The colour for modified files looks like the colour that settings.json is highlighted in, aka light green.
I updated Visual Studio Code and the appearance of the currently selected line of code in the editor window has changed and now looks like this:
I tried searching online and reading their documentation, but it is not clear how to change the appearance of the highlighted line. I would like it to be one consistent color, it currently looks like a 1.5px outline. Does anyone know how to change this in the user settings file?
The outline is coming from the editor.lineHighlightBorder setting. In your user or workspace settings, add the following properties and then experiment with the colors until they match your preferences.
"workbench.colorCustomizations": {
"editor.lineHighlightBorder": "#222",
"editor.lineHighlightBackground": "#222",
}
If you prefer, you can ensure the settings only apply to a specific theme:
"workbench.colorCustomizations": {
"[Material Theme High Contrast]": {
"editor.lineHighlightBorder": "#222",
"editor.lineHighlightBackground": "#222",
}
}
Is there a way to change the cursor colour in the Visual Studio Code editor window?
I am slightly colour blind, so I would like to change it from red to something else (yellow maybe) to improve accessibility and make it easier for me to read.
Try adding this to your global preferences file:
"workbench.colorCustomizations": {
"editorCursor.foreground": "#ffff00",
"terminalCursor.foreground": "#ffff00"
}
Also worth noting that if you're colourblind, there are probably some colourblind-friendly themes for vscode out there, though I can't say I have looked for them myself.