VSCode에서 작업할 때 배경을 개인적인 이미지나 패턴으로 꾸미고 싶은가요?
그렇다면 “Background” 익스텐션을 이용해보세요.
이 익스텐션은 코드 편집기의 배경을 사용자가 원하는 이미지나 설정에 맞춰 변경할 수 있습니다.
이번 포스트에서는 Background 익스텐션을 설치하고 설정하는 방법을 알아보겠습니다.

1. 익스텐션 설치

가장 먼저 해야 할 일은 VSCode의 익스텐션 매장에서 “Background” 익스텐션을 찾아 설치하는 것입니다.
설치가 완료되면, 설정을 통해 원하는 배경을 지정할 수 있습니다.

사용 방법

설치가 완료되었다면, 이제 배경 설정을 변경할 차례입니다.
설정을 변경하기 위해선 settings.json 파일을 수정해야 합니다.
이 파일은 VSCode의 설정을 관리하는 파일로, 다양한 기능을 원하는대로 조절할 수 있습니다.

settings.json 파일을 실행하는 방법은 다양하게 있지만 우선, 명령 팔레트 사용해서 열어봅시다.
Command + Shift + P (Mac) 또는 Ctrl + Shift + P (Windows)를 누르고 “settings.json”을 입력하여 ‘사용자 설정 열기(JSON)’이란 항목을 실행하여 열 수 있습니다.

배경 사용 여부 설정

배경 사용 여부를 결정할 수 있습니다.
아래와 같이 주석을 이용하여 두 가지 옵션을 적어놓고, 필요에 따라 토글하여 사용하면 편리합니다.

"background.enabled": false, // 배경화면 끔
// "background.enabled": true, // 배경화면 켬
JSON

일반 설정

코드 영역 내부에만 배경을 표시하고 싶다면, 다음과 같이 설정하세요.

"background.style": {
    "background-position": "100% 100%",
    "background-size": "cover",  // 이미지 사이즈 설정 ('cover'를 추천. 'contain', '200px 200px')
    "opacity": 0.15  // 이미지 투명도 설정 (추천: 0.05~0.15)
},
"background.interval": 300,  // 이미지 캐러셀 간격(초). 0은 비활성화
"background.customImages": [  // 배경으로 사용할 이미지 경로 배열로 작성
    "file:///Users/userName/Downloads/your-image1.png",  //로컬 이미지를 사용할 경우 file://로 경로 지정
    "file:///Users/userName/Downloads/your-image2.png",
    "https://example.com/your-image3.jpg",
    "https://example.com/your-image4.jpg"
],
JSON

전체 화면 설정

전체 화면에 배경을 표시하고 싶다면, 다음과 같이 설정하세요.

"background.fullscreen": {
    "images": [  // 배경으로 사용할 이미지 경로 배열로 작성
        "https://example.com/your-image1.png",
        "https://example.com/your-image2.png",
        "https://example.com/your-image3.jpg"
    ],
    "position": "center",
    "size": "cover",  // 이미지 사이즈 설정 ('cover'를 추천. 'contain', '200px 200px')
    "opacity": 0.85,  // 이미지 투명도 설정 (추천: 0.85~0.95)
    "interval": 300   // 이미지 캐러셀 간격(초). 0은 비활성화
}
JSON

로컬 파일의 경로 주소를 찾는 방법

맥(Mac)

맥에서 파일의 경로를 복사하는 방법은 다음과 같습니다.

  1. Finder에서 해당 파일을 선택합니다.
  2. 파일을 선택한 상태에서 Option 키를 누른 상태로 마우스 오른쪽 버튼을 클릭하거나 Command + Option + C를 누릅니다.
  3. 나타나는 메뉴에서 “경로 이름을 복사”를 선택합니다.

또는

  1. Finder에서 해당 파일을 선택합니다.
  2. 파일을 선택한 상태에서 상단 메뉴에서 “편집”을 클릭한 후 “복사하기”를 찾습니다. 이때 Option 키를 누른 상태라면 “복사하기” 대신 “경로 이름을 복사”로 변경됩니다.

윈도우(Window)

윈도우에서 파일의 경로를 복사하는 방법은 다음과 같습니다.

  1. 파일 탐색기에서 해당 파일을 선택합니다.
  2. 선택한 파일에 대한 경로를 복사하려면 Shift 키를 누른 상태에서 마우스 오른쪽 클릭을 하세요.
  3. 나타나는 메뉴에서 “경로로 복사”를 선택하면 클립보드에 파일의 경로가 복사됩니다.

또는

  1. 파일 탐색기에서 해당 파일을 선택합니다.
  2. 상단 메뉴 바에서 “홈”을 클릭한 후 “경로 복사” 버튼을 누르세요.

이제 클립보드에 파일의 경로가 복사되었습니다.

settings.json을 단축키로 설정하고 여는 방법

자주 사용하는 설정 파일인 settings.json을 빠르게 열기 위해서는 다음과 같은 단축키를 설정할 수 있습니다:

  1. 먼저 Command + K, Command + S를 눌러 ‘바로 가기 키’ 메뉴를 연다.
  2. 그리고나서 ‘Settings.json’을 검색한 후, 원하는 단축키를 지정해줍니다.

추천하는 단축키는 ‘Command + Shift + ,’ 입니다.
이제 설정 파일에 빠르게 접근하여 배경화면 등을 원하는대로 설정할 수 있게 됩니다.
개인적인 취향에 맞게 배경을 설정하여 보다 편안하고 개성 있는 작업 환경을 만들어보세요.