I am very happy when using vscode and i love the High Contrast color theme but I don't like its border (the blue border that i marked with red in the screenshot below). I have searched in the theme-default folder but i can't change it. Does anyone know how to change it?
Screenshot
I work on VSCode. This cannot be changed currently without editing our bundled UI css, which I recommend against.
Support for theming UI elements like this is being tracked by https://github.com/Microsoft/vscode/issues/3112
If you feel this color should be changed, please open a new issue or submit a PR with the proposed fix. There seem to be multiple places where the boarder color is defined. Look for css files the use #6FC3DF for border-color. .hc-black is the high contrast selector
Related
I'm creating a custom colour theme extension for Visual Studio Code and I can't find out how to customise the colours for certain parts of the user interface. The theme is complete, apart from customising the reference popup window.
Here is the popup window I'm trying to customise:
I wish to change the blue background and if possible, the blue border lines. I'm sure this can be done because some of the built-in themes do so. Does anyone have an idea what I would need to put into the colour theme file to achieve this?
I'm also looking for pointers to customise the status bar colour (at the base of the editor).
As far as I know, this is not possible.
Some of the built-in themes are build differently. Most themes are textmate style themes, but you can see here that some of the built-in themes are .json files and are somehow handled differently.
You can find the theme documentation here. Specifically, this part is relevant:
Besides the TextMate language grammar standard scopes, VS Code also
has custom theme settings which you can use to tune your own theme:
rangeHighlight: Background color of range highlighted, like by Quick open and Find features.
selectionHighlight: Background color of regions highlighted while selecting.
inactiveSelection: Background color of selections when not in focus.
wordHighlight: Background color of a symbol during read-access, like reading a variable.
wordHighlightStrong: Background color of a symbol during write-access, like writing to a variable.
findMatchHighlight: Background color of regions matching the search.
currentFindMatchHighlight: Background color of the current region matching the search.
findRangeHighlight: Background color of regions selected for search.
linkForeground: Color of links.
activeLinkForeground: Color of active links.
hoverHighlight: Background color when hovered.
referenceHighlight: Background color of a reference when finding all references.
guide: Color of the guides displayed to indicate nesting levels.
You can find an example VS Code theme here which includes the custom
settings.
As we can see here, there is no special override for the references pane.
We can, though, see in the code that the dark blue for dark themes and the light blue for light themes that you're seeing in the references pane is a default value set in code here.
The colours for the UI itself are stored in the following file (ubuntu): /usr/share/code/resources/app/out/vs/workbench/electron-browser/workbench.main.css
You can edit that, or wait for March 2017 where a new version will be released which will allow customising these colours more easily.
Revisiting this in Sept/2022 out of necessity, I confirmed VS Code 1.70 has native support for manipulating colors for the Go to References/Definitions and Peek... overlays.
Change the overlay background and border as follows, but there's lots of other settings too; see peekView*
"workbench.colorCustomizations": {
"peekViewEditor.background": "#01041a",
"peekViewResult.background": "#054c8a",
"peekView.border": "#04fafa"
I can read the completion tips apart from the links following "See also".
Can anyone tell me how to change this colour alone?
#azurefrog Your link to change the background color provided a workaround solution, which is to select the relevant text or change the background colour permanently, thus altering the colour contrast between the font and the background and thereby making the text readable. Its a shame that Eclipse proggies don't apparently monitor stackoverflow as I'm sure they could finger the solution immediately.
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
I was looking at this dark theme post and applied Moonrise theme on Eclipse Juno. I love everything it lays out except for the expandable arrow color. It's barely visible when my mouse isn't hovered. Does anyone know if this is possible to change?
As Spyros has mentioned, the author noted that the arrows color is impossible to change which is unfortunate.
Regardless, if you don't mind working under old graphic properties (yay!), the system arrow is replaced with a white box plus sign which makes everything visible. The drawback is, of course, the Windows 7 theme is gone. Found this by accident when trying to solve the performance issue: Look at Pyree's solution
I am afraid that is not possible due to the limitation of the css engine used to theme eclipse, according to the theme's author. (github)
I'm putting together this form for a client project, using ExpressionEngine and Freeform Pro, and for some reason, I'm getting this green highlight on my select multiple field:
(sorry, I can't post a link)
I'm not finding the green anywhere in the CSS. Where might it be defined, and how could I change it? I'm not aware of any CSS that affects the highlight color of form elements.
Thanks!
It was actually the highlight color setting in the OSX System Preferences. Apparently, it cannot be overridden in CSS3.