twitter facebook

VSCodeやCursorの色のカスタマイズ

VisualStudioCode や Cursor の色のカスタマイズ方法です。各種テーマではしっくりこない場合は「setting.json」をいじっていけば エディタやサイドバーなど けっこう細かい変更ができます。
  • ファイル
  • ユーザー設定
  • 設定
  • 「setting」で検索
  • 「settings.json で編集」(画像のオレンジの箇所) をクリック
settings.json を直接編集していく

settings.json 設定の参考

以下は参考です。"workbench.colorCustomizations" が主なポイントです
下記設定後のデザイン
settings.json の "workbench.colorCustomizations" 部分
"workbench.colorCustomizations": { //"activityBar.background":"#FF0000", "dropdown.background": "#3355aacc", "dropdown.border": "#ff0", "dropdown.foreground": "#fff", "input.background": "#ffffff", "input.border": "#00aaff", "input.foreground": "#000", "inputOption.activeBorder": "#00aaff", "inputValidation.errorBackground": "#ffdddd", "inputValidation.errorBorder": "#ff0000", "widget.shadow": "#00ccffee", "scrollbar.shadow": "#00ccffee", //"selection.background":"#ff0", // エディター "editorWhitespace.foreground": "#3757C7A7", "editor.lineHighlightBackground": "#1f1fffcc", "editor.lineHighlightBorder": "#1f1ffaff", "editorLineNumber.foreground": "#6793e0", // "editor.lineHighlightBackground": "#5c75e331", //"editor.selectionBackground": "#ffffff88", "editor.selectionBackground": "#ffffff77", "editor.selectionHighlightBackground": "#7070ffcc", "editorCursor.foreground": "#ffffc499", "editor.background": "#000000", "editor.foreground": "#ffffff", "editor.bracketPairColorization.enabled": true, "editor.guides.bracketPairs": true, // "editor.findMatchBackground": "#aaaaaa", // スクロールバー "scrollbarSlider.background": "#7070ffcc", "scrollbarSlider.hoverBackground": "#50a0ffff", // 上部タブ "tab.activeBackground": "#404090", "tab.activeForeground": "#ffffff", "tab.border": "#777777", //"tab.activeBorder": "#777777", "tab.inactiveBackground": "#333333", "tab.inactiveForeground": "#eeeeee", // ターミナル "terminal.background": "#282936", "terminal.foreground": "#E9E9F4", "terminalCursor.background": "#E9E9F4", "terminalCursor.foreground": "#E9E9F4", "sideBar.background": "#282936", "sideBar.foreground": "#ffffff", "sideBar.border": "#a8ac0d", "editorGroup.border": "#a8ac0d", "titleBar.border": "#a8ac0d", //"sideBarTitle.foreground": "#000000", // 主にファイル一覧など "list.inactiveSelectionBackground": "#cddb0163", "list.inactiveSelectionForeground": "#ffffff", "list.hoverBackground": "#a89e0fc4", "list.hoverForeground": "#ffffff", // .git の .ignore されている色 "gitDecoration.ignoredResourceForeground": "#55aadd", //"list.foreground":"#ffffff", //"list.focusBackground": "#ffffff", //"list.inactiveSelectionBackground": "#ffffff", //"list.focusHighlightForeground": "#ff0000", // 左側のナビ "sideBarSectionHeader.background": "#0030a0c5", "sideBarSectionHeader.foreground": "#ffffff", "sideBarSectionHeader.border": "#a8ac0d" //"window.activeBorder": "#ffffff", //"window.inactiveBorder": "#ff0000", //"activityBar.border": "#ff0000", },
AUTHOR
@えのえの
最終更新日 2024/11/22
FAVORITE good stock
LINK TAG
記法を見る
1732238768