VSCodeの見た目を自分好みにする

2021-02-27

VSCode の設定


変えすぎて何が何だかよくわからなくなってきそうなので整理も兼ねて設定を並べていきたいと思います.


テーマ

Solarized Dark を使用しています.
Solarized

"workbench.colorTheme": "Solarized Dark",


フォント

半角が Cancadia Code,全角日本語が Han Code になるように設定しています. Cancadia Code は Microsoft の作った WindowsTerminal のデフォルトフォントで,リガチャにも対応しています. 日本語は見やすさ重視です.
microsoft/cascadia-code: This is a fun, new monospaced font that includes programming ligatures and is designed to enhance the modern look and feel of the Windows Terminal.
adobe-fonts/source-han-code-jp: Source Han Code JP | 源ノ角ゴシック Code

"editor.fontFamily": "Cascadia Code, Han Code JP",

リガチャ(合字)は個別に有効にする必要があります.

"editor.fontLigatures": true,


ターミナルの配色

Onehalfという配色を使ってます.
配色テーマを VSCode の settings.json 用に成形してくれてるサイトがあるのでとても便利です.
Base16 Terminal Colors for Visual Studio Code

"workbench.colorCustomizations": {
        "terminal.background": "#282C34",
        "terminal.foreground": "#ABB2BF",
        "terminalCursor.background": "#ABB2BF",
        "terminalCursor.foreground": "#ABB2BF",
        "terminal.ansiBlack": "#282C34",
        "terminal.ansiBlue": "#61AFEF",
        "terminal.ansiBrightBlack": "#545862",
        "terminal.ansiBrightBlue": "#61AFEF",
        "terminal.ansiBrightCyan": "#56B6C2",
        "terminal.ansiBrightGreen": "#98C379",
        "terminal.ansiBrightMagenta": "#C678DD",
        "terminal.ansiBrightRed": "#E06C75",
        "terminal.ansiBrightWhite": "#C8CCD4",
        "terminal.ansiBrightYellow": "#E5C07B",
        "terminal.ansiCyan": "#56B6C2",
        "terminal.ansiGreen": "#98C379",
        "terminal.ansiMagenta": "#C678DD",
        "terminal.ansiRed": "#E06C75",
        "terminal.ansiWhite": "#ABB2BF",
        "terminal.ansiYellow": "#E5C07B"
    },



おわり