VSCode の背景をグレーにする

ということで、VSCode でスマホアプリを書いていこうと思ったけど、背景が見にくいので変更していきます。
こうやってスマホアプリ作成から遠ざかってくのです、、、

背景色を変えたい

VSCode に限らず、 Atom や SublimeText といったコーディング用のエディタでも、eclipse や VisualStudio といった IDE でも、背景が白か黒のテーマばかりです。

白い背景

背景色が強くて目がチカチカします。

黒い背景

ネオンみたいで目がチカチカします。


私は学生時代からグレーの背景を使用してきた(きっかけは忘れた)ので、コーディングの環境が変わるたびに背景色の変更に多大な時間を費やしてきました。
正直しんどいのでグレーがメジャーになってほしいのです。

グレーのテーマを作成

ということで、グレー背景のテーマを作ってマーケットプレイスに公開してみました。

Gray Gray Gray - Visual Studio Marketplace
Extension for Visual Studio Code - A gray color theme for Visual Studio Code

見た目は下記のような感じになります。

ホントはもっと色は少なくしたかったんですが、関数やら型やらを見分けれるようにと思って作ってたら思いの外カラフルになってしまった、、、

背景色の変え方

VSCodeではsettings.jsonに以下のような設定を記載していくことで背景色が変更できます。
例はエディタ部分の背景色と文字色を設定しています。

    "workbench.colorCustomizations": {
        "editor.background": "#C8C4C0",
        "editor.foreground": "#000000",
    },

こんな設定をまとめたのがテーマになります。

VSCodeで変更できる項目を全部まとめてみようと思ったけど、400項目以上あるので諦めました。
いつかまとめたいところです。

コメント

タイトルとURLをコピーしました