Hey developers, looking to customize your VS Code theme? Here’s how!
One of the most important tools in a developer’s toolkit is a text editor. A text editor is where a developer does the majority of their coding and problem-solving. There are many different kinds in the world of development, each with their own features and customization options.
At Juno, we use Visual Studio Code in our Web Development course and Web Development Bootcamp. VS Code is one of the most widely-used text editors by developers. It has many themes and plugins developed directly for it, and it’s very easy to use.
We'll show you how to change the colours in Visual Studio Code, plus 10 cool themes that every developer should try out!
How to change your VS Code theme and colours
Looking to personalize your Visual Studio Code? You can change its theme, colours, and font easily through its settings. Go to:
- File > Preferences > Color Theme on a PC
- Code > Preferences > Color Theme on a Mac, or use the shortcut Command + K + T
You should see this on your screen:
Move up and down with your cursor to preview what the themes look like. If you find one you like, either click on it or press enter to make it your new colour theme - and voilà!
If you want a new colour theme that isn’t listed, there are hundreds of free options to choose from in the VS Code Marketplace. You can also get to the VS Code Marketplace by clicking on the Extension button on the left side of your editor:
10 Cool VS Code Themes
Now that you know how to change your VS Code theme, it's time to find one you love! Customizing your theme is a fun way to express your personality and change things up. We asked the Juno team to share some of their favourite VS Code Themes - here they are:
Horizon
If you're all about the vibes of a relaxing sunset, this theme is for you. Available in both dark and light modes:
Pink Cat Boo
Who says coding can't be cute af? Prove them wrong with this adorable and warm theme:
Install Pink Cat Boo for VS Code
Dracula Official
One of the most popular dark themes, created by Zeno Rocha:
Install Dracula Official for VS Code
Rainglow
This theme features a collection of over 320 colourful options - the possibilities are endless!
Soft Era
A light pastel theme for those looking to make their code cozy and cute:
Cobalt2
A sleek dark theme that works across many languages. Created by Wes Bos, one of Juno's first-ever instructors!
Rosé Pine
A classy minimalist theme, available in three beautiful colour schemes:
Synthwave '84
A Juno favourite! This retro-looking theme lets you activate a cool glow effect:
Install Synthwave '84 for VS Code
Tokyo Night
This theme is inspired by the lights of downtown Tokyo at night. Available in both dark and light modes:
Install Tokyo Night for VS Code
Fairyfloss
A whimsical, dreamy pastel theme to transport you to the clouds while coding:
Install Fairyfloss for VS Code
Looking to level up your coding skills?
Get hands-on training and build portfolio-worthy projects in our beginner-friendly and advanced coding courses.