Skip to main content

設定. スタイル. ツリービューを等幅フォントにしたい

1. 拡張機能で カスタム CSS が入れられるようにする

  • Custom CSS and JS Loader
    • be5invis.vscode-custom-css

2. 拡張機能の設定

json
"vscode_custom_css.imports": [
"file:///Users/takaaki/.vscode/css/tree.css"
],

3. CSS 設定

~/.vscode/css/tree.css

css
.sidebar .explorer-viewlet .label-name,
.editor .title .label-name {
font-family: "Cica";
}

4. 変更後に CSS をリロードする

  • Cmd + Shift + P → [Reload Custom CSS and JS]
  • → VSCode が再起動される

5. DOM 階層を調べるには

  • Ctrl+Shift+P → Toggle Developer tools
    • Chrome の開発ツールのペインが出てくる

9. TODO

  • ファイル名リネーム時の編集中の文字も等幅にしたいが
  • たぶん、下記の警告出るのは、この設定のせいなのだが
    • Your Code installation appears to be corrupt. Please reinstall.