Zenn
✨

vscodeの境界線を目立たせる

2022/11/16に公開
VS Code
tech

始めに

複数のvscodeを立ててた時に、vscodeが重なってると見づらかったので調査したメモになります

素の状態

周りの色を設定

{
    "workbench.colorCustomizations": {
        "window.activeBorder": "#B0F010",
        "window.inactiveBorder": "#ff0000"
    },
}


※アクティブじゃないので、赤が適応されています
※windows 11だと適応されないケースがあります

アクティビティバー

{
    "workbench.colorCustomizations": {
        "activityBar.border": "#B0F010",
    },
}

開いてるエディタのタブを強調

{
    "workbench.colorCustomizations": {
        "contrastActiveBorder": "#B0F010",
    },
}

タブとエディタの境界

{
    "workbench.colorCustomizations": {
        "editorGroupHeader.tabsBorder": "#B0F010",
    },
}

タイトルバーとの境界線

{
    "workbench.colorCustomizations": {
        "titleBar.border": "#B0F010"
    },
}

（たぶん）フル

以下調べるのが面倒だったので、完成系を提示

{
  "workbench.colorCustomizations": {
    "activityBar.border": "#B0F010",
    "contrastActiveBorder": "#B0F010",
    "contrastBorder": "#B0F010",
    "editorGroup.border": "#B0F010",
    "editorGroupHeader.tabsBorder": "#B0F010",
    "input.border": "#B0F010",
    "panel.border": "#B0F010",
    "tab.activeBorder": "#B0F010",
    "tab.border": "#B0F010",
    "titleBar.border": "#B0F010",
    "window.activeBorder": "#B0F010",
    "window.inactiveBorder": "#B0F010"
  },
}

最後に

途中を省略してしまったので、気が向いたときに追記します

Discussion