Visual Studio Code에서 강조 텍스트 색 변경


답변:


14

업데이트 VScode 1.12+에 대한 @Jakub Zawiślak의 답변 참조


이전 답변

Visual Studio Code는이 선택 강조 표시를 호출하고 안타깝게도 현재 색상을 사용자 지정할 수 없다고 생각합니다. 테마는 '선택'색상을 제어 할 수 있지만 '선택 강조'색상은 하드 코딩됩니다.

가능한 솔루션을 추적하는이 문제를 참조하십시오. https://github.com/Microsoft/vscode/issues/1636

(참고로이 기능을 editor.selectionHighlight설정으로 전환하거나 해제 할 수 있습니다 .)


4
구식 .
Alex

4
VSCode의 현대 버전 야쿱 Zawiślak의 답변을 참조하도록 업데이트
매트 Bierner에게

@ duyn9uyen, 수락 된 답변을 더 잘 변경하십시오.
kmchmk

266

settings.json 파일의 "Editor : Token Color Customizations"설정에 다음 줄을 추가합니다.

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

더 많은 옵션 은 테마 색상 참조참조 하십시오.


5
텍스트 색상을 변경할 수있는 방법이 있습니까? 그렇지 않으면 색 구성표의 모든 단일 색상과 짝을 이룰 때 가독성을 유지하는 배경색을 찾아야합니다. 이 ... 불행히도 VS 코드를 사용에서 저를 유지하는 두 가지 문제 중 하나입니다
브루노 엘리

3
@BrunoBEly 열고 "workbench.colorCustomizations": {}입력을 시작 "editor.selection하면 자동 완성 메뉴가 선택 전경을 포함하여 가능한 모든 키와 설명을 제안합니다.
Tobia

2
@Tobia 팁 주셔서 감사합니다! 나는 그것을 찾았지만 아마도 뭔가 잘못하고있을 것입니다. 배경과 전경을 모두 빨간색으로 설정했지만 배경 만 작동하는 것 같습니다 (VS Code 1.18.0 사용)
Bruno Ely

1
터미널 : "terminal.selectionBackground": "#f1eeb3a9",
JinSnow

1
이것은 파이썬 작동하지 않는 것, 설정은 selectionHighlightBackground컬러 vscode가 사용하는 변수 나 (예를 들어) 기능의 사용에 강조 할 때 어떤 영향을하지 않는 것
JRH

48

위의 답변은 Selected text 하고 areas with same content as selection있지만, 그들은을 그리워 Current Search Match하고 Other Search Matches- 같은 문제가있는 .

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

위의 설정은 Change All Occurrences CtrlF2 ( 여러 인스턴스 편집을 위해 각 위치에 커서를두고 문자열의 모든 항목 지능적으로 선택 하는 매우 유용한 명령)를 사용할 때 색상에도 영향을줍니다 .

최신 정보:

인기있는 확장 번호가있는 책갈피를 사용하는 사람들을 위해 -이제 책갈피 된 선의 배경색을 변경할 수 있습니다-쉽게 알아 차릴 수 있습니다. settings.json ( workbench.colorCustomizations 아래에도 있음)에 다음 줄을 추가합니다 .

        "numberedBookmarks.lineBackground": "#007700"

그리고 놓치지 마세요 아래 답변 에서 Henry Zhu의 유용한 팁을 (도움이된다면 그의 답변을 찬성하는 것을 기억하십시오) . 위의 설정 Henry의 팁을 추가 했으며 전반적인 효과가 향상되었음을 알았습니다 .


일반적인 설정 파일의 예, post mod :

    {
        "git.enableSmartCommit": true,
        "git.autofetch": 참,
        "breadcrumbs.enabled": 참,
        "git.confirmSync": 거짓,
        "explorer.confirmDelete": 거짓,
        "code-runner.saveFileBeforeRun": true,
        "code-runner.saveAllFilesBeforeRun": true,
        "workbench.activityBar.visible": true,
        "files.trimTrailingWhitespace": true,
        "telemetry.enableTelemetry": false,
        "scm.providers.visible": 0, // 0은 소스 컨트롤 패널의 수동 크기 조정을 허용합니다.
        "workbench.colorCustomizations": {
            "editor.selectionBackground": "# e788ff7c", // 현재 선택된 텍스트
            "editor.selectionHighlightBackground": "# ff00005b", // 선택과 동일한 내용
            "editor.findMatchBackground": "# 00cc44a8", // 현재 검색 일치
            "editor.findMatchHighlightBackground": "# ff7b00a1", // 기타 검색 일치
            "numberedBookmarks.lineBackground": "# 007700"
            // Henry의 팁은 여기에 있습니다 ... (위의 줄에 쉼표를 추가하는 것을 잊지 마십시오)
        }
    }


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

settings.json 파일을 여는 ALTERNATE 메서드 :

  1. Ctrl +, (쉼표)로 설정 열기

  2. 작업대

  3. 설정 편집기

  4. 상단의 검색 창에 붙여 넣기 workbench.colorCustomizations

  5. 왼쪽에서 클릭 Workbench한 다음Appearance

  6. 오른쪽 링크를 클릭하십시오. Edit in settings.json

참조 :

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


1
이 답변과 함께 한 눈에 일치하는 항목을 찾는 데 유용하다는 것을 알았습니다. RGBA에 대한 지원에 유의하십시오 (내 사용에서는 색상 값 끝에있는 75 알파 설정 :"editor.wordHighlightBorder": "#00ff0075", "editor.findMatchHighlightBorder": "#00ff0075"
Neil Guy Lindberg

팁 주셔서 감사합니다, 닐. 시도해 볼게.
cssyphus

누구든지 이것이 터미널 검색에서 일치하는 방법을 알고 있습니까?
holzkohlengrill

20

누구든지 이것을 발견하고 나처럼 위의 구성을 얻을 수 없다면 이것을 시도하십시오.

  1. 파일> 환경 설정> 설정으로 이동합니다.
  2. 검색 편집기 토큰 색상 사용자 정의를 입력하십시오.
  3. 세 이하 편집기 토큰 색 사용자 지정의 헤더
  4. settings.json에서 편집을 클릭하십시오.
  5. 오른쪽 열에서 사용자 설정 선택
  6. 이것을 json 객체에 붙여 넣으십시오.

#을보고 싶은 색상으로 바꿔야합니다.

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

위의 구성에 대한 나의 이해.

editor.lineHighlightBackground-선을 클릭하면 선 배경이 될 색상입니다.

"editor.selectionBackground"-버퍼의 다른 곳에서 일치하는 선택의 배경입니다. foo라는 변수를 생각하면 파일 전체에 사용됩니다. 그런 다음 해당 텍스트를 강조 표시하면 페이지의 다른 모든 foo가이 색상이됩니다.

"editor.wordHighlightBackground"-클릭시 기본 강조 단어가 적용되지 않는 경우 선택한 텍스트의 색상입니다. 이 값은 자동 선택되지 않는 단어를 클릭 할 때만 차이가 나는 것을 보았습니다.

editorCursor.foreground-이것은 커서의 색상입니다.


2
이것이 답이되어야합니다. 다음은 VSCode 버전 1.3+
MaylorTaylor

editor.lineHighlightBackground 더 이상이 될 것 같지 않습니다, 나는 그들이 그것을 의도적으로 제거 말을하는지 생각 : github.com/dracula/visual-studio-code/issues/68
havlock

그럴 수 있습니다.
FujiRoyale

1
감사합니다. 며칠 동안 이것을 찾으려고 노력했지만 아무도 wordHighlightBackground를 언급하지 않았습니다!
Ryan Weiss

이것은 답으로 표시되어야합니다. 10 초 수정!
Nico Butler

17

내가 테스트했듯이 테두리 색상 을 설정 하면 Sublime Text가하는 일인 배경 색상을 설정하는 것보다 읽기가 더 쉽습니다.

예를 들어 다음 행을 추가하십시오 settings.json.

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

선택한 단어는 다음과 같이 표시됩니다.

여기에 이미지 설명 입력


6

다음과 같이 좋아하는 색상으로 변경할 수 있습니다.

단계

  1. 시각적 코드 열기
  2. Goto 파일 메뉴
  3. 환경 설정-> 설정

설정을 연 후 오른쪽 열에서 설정을 업데이트하고이 코드를 복사하여 기본 괄호 안에 붙여 넣습니다. { ... }

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

red또는 white값을 넣을 수 없습니다 .
giovannipds

1
giovannipds는, 그것의 단지 이름은 그 값이 아닌 색상 이름을 추가 할 수 있습니다, 보여
Rizo

1
그것은 코드이므로 잘못되었습니다. red그리고 white그 수의 혼란 사람들 .. 그래서 웹 색상입니다
giovannipds

3

누구도 다른 사람이 일하지 않았기 때문에 @FujiRoyale의 답변을 읽고 자신의 답변도 작동하지 않는 이유가 궁금했지만 최근 이유가 궁금했기 때문에 답변을 따랐고 (v1.18의 vscode ) 이것은 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"
    }
}

대답에서 들여 쓰기와 쉼표, 큰 따옴표 제거 (정답을 얻기 위해 사용해야했지만 대답에서 명확하지 않음)에 유의하십시오. vscode를 다시 시작할 필요는 없지만 File > Autosave기본 색상 강조 표시를 시작하는지 확인하는 것이 좋습니다. 그런 다음 하이라이트에 더 나은 색상을 선택하십시오.

workspace settings붙여 넣어이 작업을 만들 수도 있습니다.

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

{}그 오른쪽 설정 창에 있는 기존 사이에 .

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.