VSCodeのテーマ変更方法。|デザイナー、コーチ、ディレクターズメモ|井川igawa.

Memo

VSCodeのテーマ変更方法。

VS Codeのロゴ。

VSCodeのテーマ変更方法。

配色テーマの選択。

GitHubからAtomの開発終了が発表されたので、ひとまずVSCodeへ移行することに。
ただしVSCodeはちょっと画面がガチャガチャしているので、極力シンプルにしたい。

手順としては下記の流れでできました。

「Code」 > 「基本設定」 > 「配色テーマ」へ進む。

画面左下の歯車マークからも進むことができる。
ショートカットでは「Command」 + 「,」。 Winの場合は「Ctrl」 + 「,」。

「配色テーマ」 の中から自分の好きなものを選択する。

今回は「Atom One Dark」を選択。

配色テーマの選択。

背景色やテキストカラーがAtomと同じになる。

「Atom One Dark」を選択した場合の画面。(テーマは他のものでももちろんOK。)

VSCodeのミニマップ。


ミニマップの表示 or 非表示。

minimap(ミニマップ)があるとコーディングの表示領域が狭まってしまうので、これを非表示にしたい。

「Code」 > 「基本設定」 > 「設定」へ進む。

こちらも画面左下の歯車マークからも進むことができる。
ショートカットでは「Command」 + 「,」。 Winの場合は「Ctrl」 + 「,」。

この「設定」のショートカットは、「Command」 + 「C」(「Ctrl」 + 「C」)でコピー、の様に他のソフトでも共通したよく使われている組み合わせなので覚えておくととても便利。

検索バーで、「minimap」と入力する。

カタカナで「ミニマップ」でもOK。

ミニマップのチェックを外す。

「表示」 > 「コマンドパレット」を開いて、「minimap」と入力しても可。「mini」や「ミニ」と入力したくらいの時点で表示される。

コマンドパレットも、画面左下の歯車マークからも進むことができる。
ショートカットでは「Command」 + 「Shift」 + 「P」。(Winの場合は「Ctrl」 + 「Shift」 + 「P」。)

ミニマップの表示非表示。


アクティビティバーの表示 or 非表示。

左側のアクティビティバーは、FTP設定やプラグインインストールなど、必要な時に出せば良い。
個人的には、シンプルな見た目とソースコードの領域の方が大事だ。

「表示」 > 「外観」へ進む。

アクティビティバーの項目がある。

アクティビティバーのチェックを外す。

これでミニマップとアクティビティバーが消え、左右の領域が広がり、画面がスッキリする。

VSCodeのアクティビティバー。

VSCodeの画面↓

VSCodeのシンプル画面。

Atomの画面↓

Atomの画面。

なんとなくAtom風の、シンプルなエディタ画面となる。


サイドバーの表示 or 非表示。

サイドバーも必要時に開閉すれば良い。

「表示」 > 「外観」へ進む。

プライマリサイドバーの項目がある。

VSCodeのサイドバー。

プライマリサイドバーのチェックを外す。

ショートカットでは「Command」 + 「B」。 Winの場合は「Ctrl」 + 「B」。

VSCode サイドバーを非表示に。


レイアウトコントロールも非表示に。

個人的には右上のレイアウトコントロールのアイコンも必要性を感じない。デザイン的にもごちゃごちゃしている。

メニューバーの「表示」 > 「外観」で項目が見つからなかったが、アイコンの右クリックメニューから非表示にすることができた。

アイコンの右クリックメニューから非表示に。

※この「レイアウトコントロール」は、メニューバーや右クリックメニューで表示非表示を切り替える方法が不明でした。なのでスクショが撮れませんでした。「レイアウトコントロール」が必要な方はお気をつけください。

VSCodeのレイアウトコントールを非表示に。

これでPC画面全体を、ブラウザとエディタで2分割して、コーディングが進められる。

コーディング作業の画面。

だいぶスッキリした、必要最小限のコーディング画面となりました。

プライマリサイドバーは使用頻度が多いので、ショートカット(Mac:「Command」 + 「B」。 Win:「Ctrl」 + 「B」。)を覚えて、作業内容に合わせて開閉すれば良い。

このショートカットもBarの略なのか、他のソフトでもサイドバーの開閉に使われたりするので覚えておいて損はないかもしれない。少なくともVSCodeでは良く使うショートカットだ。

VSCodeのシンプルな画面。


疲れた時は、栄養を。
ポスト投函で届く、人気のブドウ糖です。
砂糖の代わりにコーヒーや紅茶などに。

Webデザインは実務数年、職業訓練校講師数年、フリーランス数年、計15年以上のキャリアがありますが、一気にがぁっと書いています。(元々はメモ書きでしたので順次見直し、更新しています。) 事実や経験、調査や検証を基にしていますが、万一なにかしら不備・不足などがありましたらすみません。お知らせいただければ訂正いたします。 写真や動画はフリー素材、購入素材、もしくは自前のものを使用しております。

井川 宜久 | Norihisa Igawa
デザイナー、ディレクター、講師、コーチ / 井川宜久

お問い合わせ CONTACT..

    Name(required)お名前 (必須)
    Furigana(required)ふりがな (必須)
    Email(required)メールアドレス (必須)
    Phone Number(required)電話番号 (必須)
    Message(required)ご質問・ご要望 (必須)


    免責事項について

    • 事実や経験、調査や検証を基にしていますが、私はただの人間です。万一なにかしら不備・不足などがありましたらすみません。お知らせいただければ訂正いたします。
    • 万一損害・トラブル等が発生した場合でも、一切の責任を負いかねます。