All the VS Code default themes (and any others that I've seen) have a uniform background color between the main view and the gutter. This makes it really hard to tell if you're at the start of a line (or to click there). Is the cursor at the start of the line here?
This is especially annoying with Python where indentation matters and you can't simply auto-indent a block once your indentation is messed up.
I often find myself pasting a block only to find that I was one space away from the start of the line and the pasted block therefore being offset.
Simply setting the gutter to a light grey background would fix this problem but looking at the default theme files I can't see any settings for the gutter. I've also looked at a theme from the store (Material) which has a few keys relating to gutter colours but changing them did not do anything.
Is there any way to modify the gutter background colour in VS Code?
Update: Version 1.8 of VS Code comes with a new setting to render the line highlight which can help with this when set to 'gutter':
You can change the gutter's background color (or colour) in settings.json. This was added in May.
"workbench.colorCustomizations": {
"editorGutter.background": "#000000" // your color here
}
or you can add
"editor.rulers": [ 0 ]
This won't change the background but it will add a line between the gutter and the editor.
The problems is that the gutter pointers are just not enabled by default.
Open preferences, workspace settings and set
{
"editor.renderIndentGuides": true,
"editor.renderWhitespace": "all"
}
You should see the guidelines and whitespace, hope it helps.
For more settings like this check -> https://code.visualstudio.com/Docs/customization/userandworkspace
Please install 'Python For VSCode' extension to solve the indentation issue.
Related
I'm coding with SQL in Visual Studio Code. I'm using the default font, Dark(Visual Studio). When my text is not highlighted/selected, it shows with a strange background color that shouldn't be there by default. What is the user setting to override this?
This was a feature introduced to SQLTools v0.22.2 to indicate what code would be executed by Run current query:
https://github.com/mtxr/vscode-sqltools/issues/592
One proposed fix is to add this to your settings:
"workbench.colorCustomizations": {
"sqltools.currentQueryBg": "#ff0000",
"sqltools.currentQueryOutline": "#ff0000"
}
You will need to change the above colors accordingly. It's far from ideal, since you'll need to tweak the settings every time you change themes in VS Code.
I'm using the default theme. The terminal's colors are impossible to read, make no sense, and are inconsistent. I've tried switching themes but they're terrible in all the themes.
Here's what it looks like in the default. Are you able to read my yellow input against the gray background? And why isn't there a black background everywhere?
I realize there are settings that can manually set the fore/background colors. But I'm thinking something is broken for me because of how screwy the terminal behaves.
For example, here's what I see when I first start the terminal, type a bunch of stuff, backspace to delete half of it, resize the terminal pane, then delete some more. Notice how some of the deleted spaces have yellow and some have gray. Also notice how the area where the CWD would be shown is all black.
Here are the contents of my settings.json file:
{
"window.zoomLevel": 0,
"git.enableSmartCommit": true,
"workbench.startupEditor": "newUntitledFile"
}
What needs fixing, and how?
Edit:
Just to satisfy your curiosity, I added this to my settings.json file:
"workbench.colorCustomizations": {
"terminal.foreground": "#ffffff",
"terminal.background": "#000000"
}
No joy:
There might be something wrong in your console settings, you might want to remove the content of HKCU\Console in your registry. Save it before, obviously, but there shouldn't be any side effect: it'll just be recreated with the default settings.
Okay, so here's a list of all possible settings that you could tweak in your terminal window colorscheme: (source)
"workbench.colorCustomizations": {
"terminal.background":"#1D2021",
"terminal.foreground":"#A89984",
"terminalCursor.background":"#A89984",
"terminalCursor.foreground":"#A89984",
"terminal.ansiBlack":"#1D2021",
"terminal.ansiBlue":"#0D6678",
"terminal.ansiBrightBlack":"#665C54",
"terminal.ansiBrightBlue":"#0D6678",
"terminal.ansiBrightCyan":"#8BA59B",
"terminal.ansiBrightGreen":"#95C085",
"terminal.ansiBrightMagenta":"#8F4673",
"terminal.ansiBrightRed":"#FB543F",
"terminal.ansiBrightWhite":"#FDF4C1",
"terminal.ansiBrightYellow":"#FAC03B",
"terminal.ansiCyan":"#8BA59B",
"terminal.ansiGreen":"#95C085",
"terminal.ansiMagenta":"#8F4673",
"terminal.ansiRed":"#FB543F",
"terminal.ansiWhite":"#A89984",
"terminal.ansiYellow":"#FAC03B"
}
Now for me, the colors of folder names was too bright over an even brighter background color that highlighted them and I couldn't read squat (that's because of my VSCode theme called NightOwl -- :P Sarah) so I thought (wrongly) to change terminal.background and terminal.foreground properties but that refer to the entire rendered window of the terminal.
Because these properties are actually named after Ansi Escape Codes, what I was actually looking for were these properties: terminal.ansiBlue for folder name text color and terminal.ansiGreen for folder name background highlight color.
As soon as I tweaked those, my terminal was good to go.
The way to do it is to just set all these settings and start removing or changing them to see which is which for your preference. K Thx Bye
Also beware that terminal.ansiGreen is used by git diff as a color to show additions.
On March 8th 2022 the default value for the integrated terminal "minimum contrast ratio" was updated from 1 (no effect) to 4.5 (minimal effect). Depending on your color settings and what is being displayed, this can cause your integrated terminal foreground colors to be wrong.
To disable this feature, override the default in your own settings.json file:
"terminal.integrated.minimumContrastRatio": 1
There are two solutions. Xavier's solution works, and mklement0's comment was also correct.
Solution #1
Do what Xavier said (and upvote his answer).
But, if you don't want to mess up registry settings (or if, like me, you have lots of registry settings nestled under the HKCU\Console root), then...
Solution #2
Get Windows 10 build number 18309 (or newer)
Join the Windows Insider Program
Make sure you're on a "ring" that includes a new-enough build. For me at this moment that meant joining the "fast" ring
Wait forever for updates to finish installing
Add "terminal.integrated.windowsEnableConpty": true to your settings.json
Restart terminals
Upvote mklement0's comment
...
Profit!
I am new to VS Code (and I'm trying to better my PowerShell skills) and have/had this same problem. Deleting all the Reg keys cited above related to colors seemed to fix it, but I believe the root problem is that VS Code seems to be trying to honor the color scheme set up outside the VS Code Terminal itself, from the shell. Really annoying and I'm not sure how to separate the two.
I had setup a blue background/yellow font scheme in PS prior to installing VS Code. That was the same color scheme the terminal in VS Code was displaying directly around the text.
I resently switched to Visual Studio Code as my editor. I installed my favorite theme "Material Theme Palenight High Contrast". I'm in love with it. There is just on problem, that really hinders me when coding on my laptop.
The squiggly lines of the linting error are super dark, because they have opacity.
As you can see here, one can barely see the error below item. Is there a way to change the opacity of linting errors?
EDIT: I tried setting workbench.colorCustomizations but that caused my theme to disappear.
Edit 2: I tried setting the theme specific settings like this:
"workbench.colorCustomizations": {
"[Material Theme Ocean High Contrast]": {
"editorError.foreground": "#ff0000"
}
},
but it didn't work. The color of the squiggly stayed the same.
The instructions on the theme page you linked say to use editor.colorCustomizations, not workbench.colorCustomizations. Have you tried that?
There's also a bit above the link I gave that talks about setting the accent color. They don't define what "accent color" means, so I'm not sure if that color is the thing you're trying to change, but you might try it.
I was able to find a fix. Go to the place where your extensions are installed:
/Users/user-name/.vscode/extensions/extension-name/themes/theme-name.json
In that file find the values for editorError.foreground and editorWarning.foreground. Here you can overwrite their values and it will work.
I'm just asking myself, whether this should be an issue for the VSCode repository? Since setting the settings in the user settings should overwrite this. One shouldn't have to change this .json file. Especially since this will change back again, if you re-install the theme.
Dummy Edit 🤦🏻♂️:
Damn, I accidently wrote Oceaning insteand of Palenight. The color customizations work... My bad. No need to do this hacky trick I described above.
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've dug through every damn color setting under Tools> Options. Went through every Fonts & Color, Editor, PHP etc and I'll be damned if I can figure out how to change the background row highlighting for when you have an error. I've been able to change ever other color to fit my personal preference cept this one. Here's a screen shot of the problem:
I would like to change the background red to a dark red so the text is easier to ready.
Using Netbeans 7.4
Thank you for your time and consideration.
Edit: Per Ben's point, here's the current options and the code behind the panel to show it's not working:
Final update, here's the end result which is close enough:
By looking at your screenshots (correct me if I am wrong) I can see that you have set your current row highlighting to red:
Tools-> Options-> Fonts&Colors-> Highlighting(Tab)-> Highlight Caret Row
As far as I know you can't set different background highlighting options for errors. So what you can do is set the formatting options for errors:
Font: No need to explain this.
Foreground: This is the text color if you change this it will disregard all other formatting options that you may have set, so lets leave it as is.
Background: This is what you want to change so that text don't get lost in the formatting. If you scroll to the bottom you can also set custom colors.
Effects: Irrelevant
Effect Color: Disabled if effects is None and only applies to the effect.
As you can see I set mine to yellow just as an example.
As you can see in this screen shot my background highlighting is light grey as well as my string formatting. So it is impossible to read, but by changing the error formatting this is the result:
Alternatively you can just select another background highlighting color that suits your formatting better.
Try Fonts&Colors->Syntax->Error
You can also try setting the Annotations color for "Error", mine was set to a specific color (after importing a theme) instead of 'Inherited', making text unreadable in a similar way.
This was really annoying for me too and most answers didn't help. I think that I have figured it out.
In netbeans 12 you need to change two things.
Tools->Options->Fonts&Colors->Syntax->Java->Error->change background color. This will only change the background of the code in error and not the red background of the rest of the lines white space.
To fix the red on the whitespace.
Tools->Options->Fonts&Colors->Annotations->Error(the one with the exclamation point)->change background color
I selected inherited to have no whitespace highlighting.
enter image description here