web-dev-qa-db-fra.com

Modifier la couleur du texte de surbrillance dans le code Visual Studio

À l'heure actuelle, il s'agit d'une légère couche grise, difficile à voir. Un moyen de changer la couleur par défaut?

 enter image description here

visual-studio-code
45
duyn9uyen

Update Voir la réponse de @Jakub Zawiślak pour le VScode 1.12+

Ancienne réponse

Visual Studio Code appelle cette sélection la mise en évidence et malheureusement, je ne pense pas que la couleur soit personnalisable pour le moment. Les thèmes peuvent contrôler la couleur de «sélection», mais la couleur de «sélection en surbrillance» est codée en dur.

Consultez ce problème pour suivre une solution possible: https://github.com/Microsoft/vscode/issues/1636

(Remarque: vous pouvez activer ou désactiver cette fonction avec le paramètre editor.selectionHighlight.)

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

Voir Référence de couleur de thème pour plus d'options

129
Jakub Zawiślak

Les réponses ci-dessus couvrent leSelected textetareas with same content as selection, mais elles manquent leCurrent Search MatchetOther Search Matches-qui ont exactement le même problème.

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

Exemple de fichier de paramètres typique, post mod:

 {
 "git.enableSmartCommit": vrai, 
 "git.autofetch": vrai, 
 "breadcrumbs.enabled": vrai, 
 "git.confirmSync": false, 
 "Explorer.confirmDelete": false, 
 "code-runner.saveFileBeforeRun": true, 
 "code-runner.saveAllFilesBeforeRun": true , 
 "workbench.activityBar.visible": true, 
 "files.trimTrailingWhitespace": true, 
 "telemetry.enableTelemetry": false, 
 "workbench. colorCustomizations ": {
" editor.selectionBackground ":" # e788ff7c ", // Texte actuellement SELECTIONNE 
" editor.selectionHighlightBackground ":" # ff00005b ", // Même contenu que la sélection 
 "editor.findMatchBackground": "# 00cc44a8", // RECHERCHE MATCH actuelle [.____. "" editor.findMatchHighlightBackground ":" # ff7b00a1 "// Autre RECHERCHE MATCH 
} 
}

Où trouver le fichier 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éthode ALTERNATE pour ouvrir le fichier settings.json:

  1. Ctrl +, (virgule) pour ouvrir les paramètres

  2. Table de travail

  3. Éditeur de paramètres

  4. Dans la zone de recherche en haut, collez workbench.colorCustomizations

  5. Sur la gauche, cliquez sur Workbench puis sur Appearance

  6. Cliquez sur le lien à droite: Edit in settings.json

Références:

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

3
gibberish

Comme je l'ai testé, la définition de la couleur de la bordure facilite la lecture par rapport à la définition de la couleur d'arrière-plan, comme le fait Sublime Text.

Par exemple, ajoutez ces lignes dans settings.json:

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

Les mots sélectionnés seront affichés comme ceci:

enter image description here

3
henry zhu

vous pouvez le changer avec votre couleur préférée par:

Pas

  1. Code visuel ouvert 
  2. Aller au menu de fichier
  3. Préférences -> Paramètres

après avoir ouvert les paramètres, vous mettrez à jour vos paramètres dans la colonne de droite, copiez et collez ce code entre les crochets principaux. { ... }

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

Si quelqu'un se retrouvait à lire la réponse de FujiRoyale car aucun des autres ne marchait, et se demandait pourquoi son/elle ne fonctionnait pas non plus, ) ceci comme une configuration user settings:

{
    // 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"
    }
}

Notez l'indentation et les virgules ainsi que la suppression des guillemets dans leur réponse (avec laquelle j'ai dû jouer pour bien faire les choses, ce qui n'était pas très clair dans la réponse). Il ne devrait pas être nécessaire de redémarrer vscode, mais cela vaut peut-être la peine d'aller à File > Autosave et de voir si vous commencez à obtenir des tons clairs de couleurs primaires. Et puis choisissez de meilleures couleurs pour vos faits saillants. 

Vous pouvez aussi faire cela dans workspace settings en collant 

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

entre le {} existant dans ce volet de droite.

1
volvox

Si quelqu'un trouve cela et, comme moi, était incapable de faire fonctionner la configuration ci-dessus, essayez-le. 

  1. allez dans fichier> Préférences> paramètres
  2. saisissez les personnalisations de couleur du jeton de recherche éditeur
  3. sous les personnalisations de couleur de jeton Editor
  4. cliquez sur edit dans settings.json
  5. dans la colonne de droite, sélectionnez les paramètres utilisateur
  6. coller ceci dans l'objet json

Assurez-vous de remplacer le # avec les couleurs que vous voulez voir.  

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

Ma compréhension de la configuration ci-dessus.  

editor.lineHighlightBackground - lorsque vous cliquez sur une ligne, c'est la couleur que l'arrière-plan de la ligne sera. 

"editor.selectionBackground" - Il s'agit de l'arrière-plan des sélections correspondantes ailleurs dans le tampon. Pensez à une variable nommée foo et elle est utilisée dans tout un fichier. Vous mettez ensuite le texte en surbrillance et tous les autres objets de la page auront cette couleur.

"editor.wordHighlightBackground" - Il s'agit de la couleur du texte sélectionné si la mise en surbrillance par défaut de Word au clic ne prend pas effet. J'ai seulement vu cette valeur faire la différence si vous cliquez sur un mot qui ne se sélectionne pas automatiquement.

editorCursor.foreground - c'est la couleur de votre curseur. 

1
FujiRoyale

Les étapes de modification surlignent la couleur par défaut

  1. Ouvrez le code Visual Studio.
  2. Puis appuyez sur Ctrl+k,t. 
  3. Une liste déroulante apparaîtra, sélectionnez votre choix dans la liste déroulante.
0
anil shrestha