はじめに
Visual Studio Code(以下、VSCode)は柔軟にカスタマイズができるプログラミング エディターです。機能をアドインして使いやすさを追求することができるだけでなく、見た目についてもこだわりを持ってカスタマイズされている方も多いと思います。
今回はVSCodeのテーマについて個人的なおすすめを紹介します。
テーマ選びは目に優しい(チカチカしない)、文字が読みやすい、楽しくプログラミングできるということが重要かなと個人的に、これらを意識して選びました。
おすすめテーマ
GitHub Theme
GitHubがリリースするVSCodeのテーマです。
ダーク系とライト系の7種類が用意されています。
- GitHub Light Default
- GitHub Light High Contrast
- GitHub Light Colorblind
- GitHub Dark Default
- GitHub Dark High Contrast
- GitHub Dark Colorblind
- GitHub Dark Dimmed
この中でGitHub Dark Dimmedは適度に色数が多く使いやすいように思います。
GitHub Theme - Visual Studio Marketplace
Extension for Visual Studio Code - GitHub theme for VS Code
One Dark Pro
One Dark ProはGitHub Themeと共に人気のあるダーク系テーマです。
配色は下の4種類があります。
- One Dark Pro
- One Dark Pro Darker
- One Dark Pro Flat
- One Dark Pro Mix
One Dark Pro Flatはメソッドや変数がボールドになり視認しやすいと思います。また、GitHub Themeよりテキストと背景のコントラストが控えめで疲れにくい配色ではないでしょうか。
One Dark Pro - Visual Studio Marketplace
Extension for Visual Studio Code - Atom‘s iconic One Dark theme for Visual Studio Code
Dracula Official
Dracula Officialは様々なアプリに対応するテーマで、VSCode以外にもmacOSのターミナルやWindowsのNotepad++など向けにもリリースされています。
オフィシャル サイトでは他のアプリのためのテーマのインストール方法などが紹介されています。
配色は下の2種類があります。
- Dracura
- Dracura Soft
Dracura Softはカラフルでかつ見やすい配色になっています。
Dracula Official - Visual Studio Marketplace
Extension for Visual Studio Code - Official Dracula Theme. A dark theme for many editors, shells, and more.
Shades of Purple
Shades of Purpleは名前の通り紫をベースとした配色です。紫ベースはあまりないのですが、意外と見やすいと思いましたので紹介します。
配色は下の2種類があります。
- Shades of Purple
- Shades of Purple (Super Dark)
Shades of Purple - Visual Studio Marketplace
Extension for Visual Studio Code - 🦄 A professional theme suite with hand-picked & bold shades of purple for your VS Code editor and terminal apps. One of the excellent, most downloaded, and top-rated VSCode Themes on the marketplace. Part of VSCode.pro course.
Cobalt2 Theme Official
Cobalt2 Theme Officialは青ベースの配色です。テキストはカラフルな配色ですが、背景色とのコントラストのバランスがよく見やすいテーマだと思います。
私は普段このテーマを使っています😄
Cobalt2 Theme Official - Visual Studio Marketplace
Extension for Visual Studio Code - 🔥 Official theme by Wes Bos.
Tokyo Night
Tokyo Nightは寒色系が多めの配色となっていて、目に優しく見やすいテーマです。
Tokyo Nightも他のアプリのテーマとしてポーティングされています。
Windows Terminal, JetBrains IDE, Sublime Text, Visual Studio 2022, Firefoxなどです。詳しくはこちらをご確認ください。
配色は下の4種類があります。
- Tokyo Night
- Tokyo Night Storm
- Tokyo Night Light
Tokyo Night - Visual Studio Marketplace
Extension for Visual Studio Code - A clean Visual Studio Code theme that celebrates the lights of Downtown Tokyo at night.
Noctis
Noctisは11種類の配色と数多くのプログラミング言語をサポートしているのが特徴です。
対応言語はこちらから確認できます。
配色はブルー系やグリーン系だけではなく、ワイン色といった特徴的な配色が多い印象です。
気に入った配色はブルー系のNoctis Azureusです。テキストと背景色とのコントラストがほどよく、疲れにくい配色だと思います。
Noctis - Visual Studio Marketplace
Extension for Visual Studio Code - Noctis is a collection of light & dark themes with a well balanced blend of warm and cold colors
Ayu
最後にライト系のテーマを紹介します。
Ayuはカラフルですが、チカチカすることない色を選んでいるため目に優しいテーマです。
元々、Sublime Textのテーマとして作られてものをVSCode向けにポーティングされたものの様です。
配色は下の6種類です。
- Light
- Light Bordered
- Mirage
- Mirage Bordered
- Dark
- Dark Bordered
Ayu - Visual Studio Marketplace
Extension for Visual Studio Code - A simple theme with bright colors and comes in three versions — dark, light and mirage for all day long comfortable work.
おわりに
おすすめのテーマを8種類紹介しました。
他のテーマも見てみたいという方は、下の参考リンクから探すことが出来ます。
最後までご覧頂きありがとうございました。
■(広告)Visual Studio Codeのオススメ解説書!■
参考リンク
Themes Extensions for Visual Studio Code in Marketplace
Themes extensions for Visual Studio Code on marketplace.visualstudio.com
VS Code Themes
Search and preview themes for Visual Studio Code