How can I customize some of the Explorer's background colours for the selected item in VS Code? - visual-studio-code

I have simply question. How can i set background color for active file in unfocused sidebar in Visual Studio Code. In the picture, you can see it a little bit.
Also i'd like to ask you for another 2 things about customization.
How can i set border color on hover with transparent background.
How to set background color for active file in focused sidebar.

At the time of this writing, there are no dedicated settings for the explorer's listing colours. There are settings for list colours in general.
The settings you are looking for are:
"workbench.colorCustomizations": {
"list.inactiveSelectionBackground": "#880000",
"list.activeSelectionBackground": "#ff0000",
"list.hoverBackground": "#ff0000",
}
If you have set "explorer.autoReveal": false, you may want to remove that or set that to true.

Related

Change text highlight settings in Visual Studio Code for macOS

In Visual Studi Code for macOS (Version: 1.72.2), how do I change the settings for how certain text is highlighted. In the include screenshot, the highlight for the Find result (the word buret in buret.addEventListener is barely noticeable among the other highlighted words (button, enable, etc.)
Thanks in advance!
Searched through settings which is far too big to easily find it.
You can customize your theme colors. The colors you are looking for are your editor colors.
Press Ctrl+Shift+P to bring up the command palette and run the Preferences: Open JSON Settings command. Add the following lines to your configuration:
"workbench.colorCustomizations": {
"editor.findMatchBackground": "#00ff00",
"editor.findMatchHighlightBackground": "#ff0000",
},
This will change the background color of the active find match to green and of all other find matches to red. Adjust the colour values as you like.

How do I change color of Scrollbar in Visual Studio Code?

The question is - how do I change color of scrollbar in VSCode?
I want to change my scrollbar to the color of my VSCode background. Available scrollbar settings in workbench.colorCustomizations don't change it the way I want (all I could find is scrollBarSlider and scrollbar.shadow settings), and I know there's a way to change it cause it is different in other themes (it's the same color as the background in those themes, as it should be)
How my scrollbar looks right now
(Added an arrow juuuuuust incase)
Thanks a lot!
In your settings.json:
"workbench.colorCustomizations": {
"editorOverviewRuler.background": "#ff0000", // for the "track" where the scrollThumb lives
"scrollbarSlider.background": "#9aa", // for the scrollThumb color
}
For others, see theme color reference: scrollbars and editorOverViewRuler in the same link.
Do note that there are other indicators that also live in the editorOverviewRuler, like selection indicators, find match indicators and more, which have to play nice with the color as well.

selected text background color for Visual Studio Code quick search (ctrl+f) input

I've searched for this setting for a while now, but just can't find it. How can I change the background color of selected text in the search box? Here is an example - as you can see (or not), foo is selected. I'd like to change the background color of that selection.
Oddly, it is just
"workbench.colorCustomizations": {
"selection.background": "#ff0000",
}
Stumbled on it at theme base colors:
selection.background: Background color of text selections in the
workbench (for input fields or text areas, does not apply to
selections within the editor and the terminal).

How to stop VSCode having colored tab names

Since some recent update, VSCode started adding colors to tab names as seen here:
The blue, orange. No idea what the colors mean.
But I want to turn it off and have all tabs be black if it's possible.
I assume you are using the Insiders' Build. You can disable those tab "decorations" with these settings:
Workbench > Editor > Decorations: Colors
Workbench > Editor > Decorations: Badges
Those would override your tab foreground if you don't disable them.
Then you color your tab colors if you need to.
Go to settings.json and paste
"tab.inactiveForeground": "#000000",
"tab.activeForeground": "#000000",
The first one is for the color of the inactive tab name and the second one is for the color of the active tab name.
P.S. don't forget to put it inside
"workbench.colorCustomizations": {
"tab.inactiveForeground": "#yourcolor",
"tab.activeForeground": "#yourcolor",
}

How to make Eclipse's tab's background color changed when use dark theme?

I am trying to make my Eclipse cooler like IntelliJ's darcular theme. Everything is fine now except the tab's background's color. It's white and I can't see the words clearly.
Just like the picture below.
Oh, I don't know why it can be seen in the screenshot.
But what I want like this:
By TWiStErRob's comment I found where to change it for me, which also had bright tabs when switching to dark theme.
Below the steps how I changed my tabs:
Go in the top menu to window, then preferences.
Then drill down to General > Appearance > colors and fonts
There is a list with multiple background begin, background end options. If you select an option you can use the edit button to change the color.
Default you only get the basic colors. By clicking the *Define Custom Colors >>** button you can use a color picker or the hex/hsl editor fields to enter your own preferred colors. I changed them all (all the background begin/background end options) from their bright colors to darker colors.
The end result.
Thanks to TWiStErRob for giving the pointer where to find the setting.