VSCode - Text highlight in "find" box - visual-studio-code

I recently installed VSCode on a new machine, but found something odd about highlighted text in the "find" box.
How would one change the highlight color in this field in VS Code?

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).

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 terminal prompt in Visual studio code?

My current terminal has white prompt and white output
like this one https://vscode.one/img/terminal-font-size/terminal-font-size.gif
I Saw this thread about changing terminal color Color theme for VS Code integrated terminal
Foreground changes the color of entire text, but I just want to see color different between the path and output. Similar to this one
The output is white and the path is other color.
Click ctrl+shift+P and then search and Open User Setting (JSON)
Paste the JSON settings below to change basic colors
"workbench.colorCustomizations": {
"terminal.background": "#2C3E50",
"terminal.foreground": "#E0E0E0",
}
For a higher level of colour customizations, you can use this Terminal Colors Generator. It will create JSON with all colours you selected and just paste it into your settings JSON.

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).

Set color to Find/Replace dialog box in VS Code

I am creating my own custom theme in VS code. I am not able to select the find/Replace dialog box for setting the color. So, the question is how can we set the color to the Find/Replace dialog box?
I have already set the color to the input box inside the Find/Replace dialog box.
Try editing your settings.json
"workbench.colorCustomizations": {
"input.background": "#c21045"
},
I have gotten this
with :
"workbench.colorCustomizations": {
"editorWidget.background":"#ff0000",
},
For more information about vs code theme api:
https://code.visualstudio.com/api/references/theme-color
That's a great idea of creating custom theme.
From my point of view, VS code uses common color for same category.
Vs code uses same color variable for all input box. here it is.
"input.background": "#000"
Here is the input color Property from which, this color is applied to searchBox's input.
Note: This Property will update all input's background color.

How to customize command palette color and keybindings when creating vscode theme

Creating a VSCode theme for myself. I like the color configuration I have at the moment, but when I open the command palette, it is 'see-through' making it hard to read. How can I configure the palette when designing my theme?
V1.36 added these two colorCustomizations for the command palette/quick open panel:
"quickInput.background": "#ff0000",
"quickInput.foreground": "#fff"
Thanks to add color controls to quick open panel PR.
And those keybindings shown to the right of each command will be themeable in v1.56 (in Insiders already). See https://github.com/microsoft/vscode/commit/a3444b121230a97f3ae07304780ea130ea092542
"workbench.colorCustomizations": {
"keybindingLabelBackground": "#f00",
"keybindingLabelForeground": "#f00",
"keybindingLabelBorder": "#f00",
"keybindingLabelBottomBorder": "#f00",
"keybindingLabelShadow": "#f00"
}
To change the background of the command palette, modify the sideBar.background setting. More info
I had the exact same problem as you so I went hunting for it in the docs. At first I thought it was a list colour setting because changing list.focusBackground changes the selected item in the command palette.