Cambiar el color del texto resaltado en Visual Studio Code

En este momento, es una superposición gris tenue, que es difícil de ver. ¿Alguna forma de cambiar el color predeterminado?

Actualización Vea la respuesta de @Jakub Zawiślak para VScode 1.12+

Respuesta antigua

Visual Studio Code llama a esta selección resaltado y, desafortunadamente, no creo que el color sea personalizable actualmente. Los temas pueden controlar el color de 'selección', pero el color de 'resaltado de selección' está codificado.

Vea este problema rastreando una posible solución: https://github.com/Microsoft/vscode/issues/1636

(Como nota al margen, puede alternar esta función o desactivarla con la editor.selectionHighlightconfiguración).

Agregue las siguientes líneas en la configuración "Editor: Personalizaciones de color de token", dentro del archivo settings.json.

"workbench.colorCustomizations": {
    "editor.selectionBackground": "#135564",
    "editor.selectionHighlightBackground": "#135564"
},

Consulte Referencia de colores del tema para obtener más opciones.

Las respuestas anteriores cubren el Selected texty areas with same content as selection, pero omiten el Current Search Matchy Other Search Matches, que tienen el mismo problema .

"workbench.colorCustomizations": {
    "editor.findMatchBackground": "#00cc44a8", //Current SEARCH MATCH
    "editor.findMatchHighlightBackground": "#ff7b00a1" //Other SEARCH MATCHES
}

Tenga en cuenta que la configuración anterior también afectará los colores al usar Cambiar todas las ocurrencias CtrlF2 (un comando súper útil que selecciona de manera inteligente todas las ocurrencias de una cadena, colocando cursores en cada ubicación para la edición de múltiples instancias) .

ACTUALIZAR:

Para aquellos que usan la popular extensión Marcadores numerados , ahora puede cambiar el color de fondo de las líneas marcadas, hace que sea muy fácil notarlas. Agregue esta línea a su settings.json (también en workbench.colorCustomizations ):

        "numberedBookmarks.lineBackground": "#007700"

Y no se pierda el útil consejo de Henry Zhu en su respuesta a continuación (recuerde votar a favor de su respuesta si lo encuentra útil) . Yo añadí punta de Henry a los ajustes anteriores, y parece que el efecto global mejorada.

Ejemplo de un archivo de configuración típico, post mod:

    {
        "git.enableSmartCommit": verdadero,
        "git.autofetch": verdadero,
        "breadcrumbs.enabled": verdadero,
        "git.confirmSync": falso,
        "explorer.confirmDelete": falso,
        "code-runner.saveFileBeforeRun": verdadero,
        "code-runner.saveAllFilesBeforeRun": verdadero,
        "workbench.activityBar.visible": verdadero,
        "files.trimTrailingWhitespace": verdadero,
        "telemetry.enableTelemetry": falso,
        "scm.providers.visible": 0, // 0 permite el cambio de tamaño manual de los paneles de control de fuente
        "workbench.colorCustomizations": {
            "editor.selectionBackground": "# e788ff7c", // Texto actualmente SELECCIONADO
            "editor.selectionHighlightBackground": "# ff00005b", // Mismo contenido que la selección
            "editor.findMatchBackground": "# 00cc44a8", // PARTIDA DE BÚSQUEDA actual
            "editor.findMatchHighlightBackground": "# ff7b00a1", // Otras PARTIDAS DE BÚSQUEDA
            "numbersBookmarks.lineBackground": "# 007700"
            // El consejo de Henry va aquí ... (no olvides agregar una coma a la línea de arriba)
        }
    }

Dónde encontrar el archivo settings.json:

Depending on your platform, the user settings file is located here:

Windows %APPDATA%\Code\User\settings.json
macOS $HOME/Library/Application Support/Code/User/settings.json
Linux $HOME/.config/Code/User/settings.json

Método ALTERNO para abrir el archivo settings.json:

1. Ctrl +, (coma) para abrir Configuración

2. Banco de trabajo

3. Editor de configuración

4. En el cuadro de búsqueda en la parte superior, pegar workbench.colorCustomizations

5. A la izquierda, haga clic en Workbenchy luegoAppearance

6. Haga clic en el enlace de la derecha: Edit in settings.json

Referencias:

https://code.visualstudio.com/api/references/theme-color#editor-colors

https://code.visualstudio.com/docs/getstarted/themes#_customize-a-color-theme

https://code.visualstudio.com/docs/getstarted/settings

Si alguien encuentra esto y, como yo, no pudo hacer funcionar la configuración anterior, intente hacer esto.

1. vaya a archivo> Preferencias> configuración
2. escriba las personalizaciones de color del token del Editor de búsqueda
3. debajo del encabezado de personalizaciones de color del token del editor
4. haga clic en editar en settings.json
5. en la columna de la derecha, seleccione la configuración del usuario
6. pega esto en el objeto json

Asegúrese de reemplazar los # con los colores que desea ver.

"workbench.colorCustomizations": {
    "editor.lineHighlightBackground": "#<color1>",
    "editor.selectionBackground": "#<color2>",
    "editor.wordHighlightBackground": "#<color3>",
    "editorCursor.foreground": "#<color4>"
},

Mi comprensión de la configuración anterior.

editor.lineHighlightBackground: cuando haces clic en una línea, este es el color que tendrá el fondo de la línea.

"editor.selectionBackground": este es el fondo de las selecciones coincidentes en otras partes del búfer. Piense en una variable llamada foo y se usa en todo un archivo. Luego, resalta ese texto y todos los demás foos en la página serán de este color.

"editor.wordHighlightBackground": este es el color del texto seleccionado si la palabra resaltada predeterminada al hacer clic no tiene efecto. Solo he visto que este valor marca la diferencia si hace clic en una palabra que no se selecciona automáticamente.

editorCursor.foreground: este es el color del cursor.

Como he probado, configurar el color del borde hace que sea más fácil de leer que configurar el color de fondo, que es lo que hace Sublime Text.

Por ejemplo, agregue estas líneas en settings.json:

"workbench.colorCustomizations": {
    "editor.selectionHighlightBorder": "#FFFA",
},

Las palabras seleccionadas se mostrarán así:

puedes cambiarlo con tu color favorito:

Pasos

1. Código visual abierto
2. Ir al menú de archivo
3. Preferencias -> Configuración

después de abrir la configuración, actualizará su configuración en la columna del lado derecho, copie y pegue este código dentro de los corchetes principales { ... }

"workbench.colorCustomizations": {
    "editor.selectionBackground": "#f00", // red color hexadecimal code
    "editor.selectionHighlightBackground": "#fff" // white hex code
},

Si alguien se encontraba leyendo la respuesta de @ FujiRoyale ya que ninguno de los demás funcionaba, y se preguntaba por qué la suya tampoco funcionó, pero como era más reciente me preguntaba por qué, seguí su respuesta y lo hice (con v1.18 de vscode ) esto como una user settingsconfiguración:

{
    // Is git enabled
    "git.enabled": true,
    // Path to the git executable
    "git.path": "C:\\Users\\t606964\\AppData\\Local\\Programs\\Git\\mingw64\\bin\\git.exe",
    "workbench.startupEditor": "newUntitledFile",
    // other settings
    //
    "editor.fontSize": 12,
    "editor.tabSize": 2,
    "git.confirmSync": false,
    "workbench.colorTheme": "Monokai",
    "editor.fontWeight": "bold",
    "editor.formatOnSave": true,
    "editor.formatOnPaste": true,
    "workbench.iconTheme": "vscode-icons",
    "explorer.confirmDelete": false,
    "files.autoSave": "off",
    "workbench.colorCustomizations": {
        "editor.lineHighlightBackground": "#f00",
        "editor.selectionBackground": "#0f0",
        "editor.wordHighlightBackground": "#00f",
        "editorCursor.foreground": "#ff0"
    }
}

Tenga en cuenta la sangría y las comas y la eliminación de las comillas dobles de su respuesta (con lo que tuve que jugar para hacerlo bien, lo cual no estaba tan claro en la respuesta). No debería ser necesario reiniciar vscode, pero puede valer la pena ir a File > Autosavever si comienza a obtener reflejos de colores primarios. Y luego elija mejores colores para sus reflejos.

También puede hacer que esto funcione workspace settingspegando

"workbench.colorCustomizations": {
    "editor.lineHighlightBackground": "#f00",
    "editor.selectionBackground": "#0f0",
    "editor.wordHighlightBackground": "#00f",
    "editorCursor.foreground": "#ff0"
}

entre lo existente {}en ese panel de configuración de la derecha.