VS Code에서 커서 스타일 및 애니메이션 변경

2023. 2. 19. 14:21·웹 개발(프론트엔드)/vs code

VS Code 편집기에는 phase, smooth, expand 및 solid까지 4가지 유형의 커서 애니메이션이 있습니다.

VS Code에서 커서에 대한 특정 애니메이션을 설정하려면 커서 애니메이션 설정을 'settings.json' 파일에 추가해야 합니다.

 

'settings.json' 열기 → 단축키(ctrl + shift + P)를 눌러 settings.json을 검색해 새로 설정합니다.

"editor.cursorBlinking": "smooth"

커서와 너비 스타일을 변경하려면 아래와 같이 원하는 스타일로 입력을 해주시면 됩니다.

"editor.cursorStyle": "line",
"editor.cursorWidth": 6,

VS Code에는 block, block-outline, line, line-thin, underline, underline-thin 이렇게 6가지 스타일의 커서가 있습니다.

 

 

 

애니메이션 예시:

Smooth

phase

Expand

Solid

 

 

 

출처 : https://dev.to/rajeshroyal/change-cursor-style-and-animation-in-vs-code-2h08

 

Change Cursor Style and Animation in VS Code

We have 4 types of cursor animations in VS Code editor. phase, smooth, expand and solid. To set a p...

dev.to

 

'웹 개발(프론트엔드) > vs code' 카테고리의 다른 글

Apache Tomcat  (2) 2025.06.26
파일질라(FileZilla) 여러 파일 동시 업로드 방법  (0) 2023.02.13
가변 폰트 크기 쉽게 계산해주는 사이트  (0) 2023.02.13
FTP 파일질라(FileZilla) 설치 및 업로드  (0) 2023.02.11
닷홈(dothome)에서 무료 호스팅 신청하기  (0) 2023.02.11
'웹 개발(프론트엔드)/vs code' 카테고리의 다른 글
  • Apache Tomcat
  • 파일질라(FileZilla) 여러 파일 동시 업로드 방법
  • 가변 폰트 크기 쉽게 계산해주는 사이트
  • FTP 파일질라(FileZilla) 설치 및 업로드
다채로운창고
다채로운창고
하루하루 기록하는 다채로운 일상 아카이브
  • 다채로운창고
    다채로운창고
    다채로운창고
  • 전체
    오늘
    어제
    • 분류 전체보기 N
      • 그래픽·드로잉 툴
        • 일러스트레이터
        • 포토샵
        • 프리미어프로
        • 클립스튜디오
        • 프로크리에이트
      • 웹 개발(프론트엔드)
        • vs code
        • HTML·CSS
        • 티스토리 스킨
      • 옵시디언 N
      • 상업적 사용가능
        • 디자인 자료
        • 무료 폰트
      • 컴퓨터 정보
        • 다채로운 팁
      • WORKROOM
        • 색감잡기
        • 이모티콘
  • 블로그 메뉴

    • 🏠 HOME
    • 🎃 GUEST BOOK
  • 링크

    • notion
    • github
  • 공지사항

  • 인기 글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
다채로운창고
VS Code에서 커서 스타일 및 애니메이션 변경
상단으로

티스토리툴바