إنتاجية

10 Visual Studio Code Themes That Are Easy on the Eyes


The built-in Visual Studio Code themes aren’t bad, but you’ll likely find yourself wanting something else. When you’re spending hours coding, you need something that’s easy on the eyes. If the built-in dark VS Code themes aren’t quite doing it for you, try these other options instead.

Installing and Customizing

Before listing Visual Studio Code themes, let’s cover how to install them. Start by choosing the theme you want and selecting Install to open Visual Studio Code. Press Install to confirm you want to install the theme. You can also open Extensions, search for your theme name, and install it directly.

Choose the theme from the Select Color Theme box. Depending on the theme, there may be multiple versions to choose from. If you don’t see this, simply click Change color theme or go to File -> Preferences -> Theme -> Color Theme, and select your theme. Try these Visual Studio Code keyboard shortcuts to get around faster.

If you want to customize a theme, install it, then go to Extensions in the sidebar (or File -> Extensions). Select the settings cog beside your theme, and edit as much as you want. If your theme doesn’t offer this, or you want even more control, use the workbench.colorCustomizations setting.

Customizing Visual Studio Code themes.

1. Best Dark Theme: One Dark Pro

One Dark Pro has quickly become one of the most popular VS Code themes for anyone who loves a dark theme. Not only is it a comfortable dark shade, but the color palette works well without being too jarring on the darker background.

One Dark Pro theme installed with Javascript sample code

Highlights

  • Multiple color variations
  • High contrast colors
  • Easy-to-read font

2. Best High Contrast: Shades of Purple

Dark themes don’t have to be only shades of black. Shades of Purple gives you various shades of purple that are surprisingly pleasing on the eyes. From a deep purple background to more vibrant purple text, if you love purple, you’ll love everything about this theme.

Visual Studio Code with Shades of Purple theme installed.

Highlights

  • Colors work well both day and night
  • Other colors mix in well to see code
  • Comes in both purple and super-dark purple

3. Best for Late Night Coding: Night Owl

As the name implies, Night Owl is designed for darker environments to make the screen much easier on your eyes – a deep blue background with the perfect color choices for working all night. But a light version is included, too, for daytime coding.

Using the Night Owl Visual Studio Code themes.

Highlights

  • Colors are muted, while still being high contrast
  • Ideal for color blindness
  • Includes both italics and no italics options

4. Best Minimal Contrast: Palenight

If high-contrast Visual Studio Code themes aren’t your favorite, try Palenight. It’s a toned down version of Shades of Purple. An elegant purple works well for both day and night coding. Plus, the color scheme isn’t overpowering, but there’s just enough contrast to make it easy to distinguish your code.

Using Palenight theme, one of the lower contrast options among VS Code themes.

Highlights

  • Includes a mid-contrast variation for more contrast
  • Includes an italics version
  • A more elegant version of Shades of Purple

5. Best for GitHub Users: GitHub Theme

If you already love how GitHub shows code, try the GitHub Theme. It’s everything you enjoy about the classic GitHub style, but within Visual Studio Code. There are nine variations to match nearly any need you have. It’s as close to GitHub’s official themes as you can get without designing your own from scratch.

Using GitHub Visual Studio Code Themes in dark.

Highlights

  • Both light and dark versions
  • Two colorblind versions
  • Two legacy variations, but they’re not updated often

6. Most Elegant: Ayu

Ayu combines elegance and simplicity into a beautiful theme designed for both short and long coding sessions. Bright colors work wonderfully against dark and light variations. Personally, I think Ayu has one of the better color schemes for the light variation.

Light version of the Ayu theme

Highlights

  • Three variations: dark, light, and mirage
  • Mirage is just slightly lighter than dark
  • Bright text stands out in all variations

7. Best Variety: Noctis

If you don’t want to install numerous Visual Studio Code themes, just install Noctis. This single theme offers 11 variations, ranging from dark to light, and everything in between. I love the Sereno variation with a deep cyan color. It works well both night and day.

Using the Sereno variation of the Noctis theme.

Highlights

  • Color variations include rose, cyan, blue, purple, orange, and violet
  • Minimus offers lower saturation if the Azureus variation is too bright
  • Lux is ideal for a light theme that’s still easy on the eyes

8. Best Subtle Theme: Panda Theme

Simple, elegant, and subtle blend seamlessly in the Panda Theme. The dark theme features subtle colors that are a pleasure to work with. While it’s minimal, this keeps the focus on your code.

Coding with the Panda Theme in Visual Studio Code.

Highlights

  • Keeps everything as simple as possible
  • Only one version included
  • Simpler colors that work well in light and dark environments

9. Best Availability: Dracula Official

If you tend to use various code editors and want a consistent theme, use Dracula Official. It’s not only one of the best VS Code themes, but it’s also available for hundreds of other apps. Odds are, if you switch code editors, Dracula Official will be available for it.

Highlights

  • Dark theme with purple hues
  • Offers two variations: normal and soft
  • Updated frequently since 2016

10. Best Low Contrast: Tokyo Night

If you prefer low-contrast Visual Studio Code themes, Tokyo Night could be the perfect theme for you. There are three variations, including a low-contrast, dimmed-light theme. It’s similar to Ayu but slightly darker. All text is easy to see, and your eyes will love it.

Tokyo Night theme in the light variation

Highlights

  • Dark variations have a little more contrast than the light
  • Inspired by Tokyo’s city lights
  • Deep purple versus black in the dark variations

Staring at a screen too long is never great for your eyes, but the right VS Code themes help drastically reduce the strain. If you’re just learning to code, try these coding games or online resources. Then, enjoy practicing in Visual Studio Code with your new favorite theme.

Image credit: Unsplash. All screenshots by Crystal Crowder.

Subscribe to our newsletter!

Our latest tutorials delivered straight to your inbox

Crystal Crowder

Crystal Crowder has spent over 15 years working in the tech industry, first as an IT technician and then as a writer. She works to help teach others how to get the most from their devices, systems, and apps. She stays on top of the latest trends and is always finding solutions to common tech problems.

مقالات ذات صلة

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *

زر الذهاب إلى الأعلى