WebStorm - Installing Custom Color Schemes (dayleress/colour-schemes)

Erik Aybar
InstructorErik Aybar

Share this video with your friends

Send Tweet

In this lesson, we'll walk through installing a custom color scheme into our WebStorm IDE. Dayle Rees's daylerees/colour-schemes has a great collection of themes ready to install in different formats for various editors.

For this example, we will install the Peacocks In Space theme into an OS X WebStorm 11 EAP installation. Note: This process will be very similar (or identical) for previous versions of WebStorm and other editors in the JetBrain's family of editors.

Tony
Tony
~ 5 years ago

This is great... but... WebStorm 2016 doesn't seem to have the same file structure for external themes? I can't find the folder you navigated to.

Where should we be downloading the theme files to?

Steve
Steve
~ 5 years ago

Thanks to Gustavo V.R. on Stack Overflow for this solution...

http://stackoverflow.com/questions/36163439/install-custom-color-scheme-in-phpstorm-2016-1-on-mac-osx

Modified a bit for our specific case.

WebStorm 2016.1 on Windows - How to install color theme (English) Go to folder: C:\Users\USERNAME.WebStorm2016.1\config
Create a new folder: colors Copy or save *.icls files of your favourite theme-color in the colors folder. Reopen WebStorm, go to: File->Settings then choose Editor->Colors & Fonts and your new theme-color appears in the select list.

Sridatta
Sridatta
~ 5 years ago

Great trick. Works like a charm in Intellij Idea too. Thanks a lot

Venkata Janapareddy
Venkata Janapareddy
~ 4 years ago

Not working for Webstorm2016.3

I did everything u did, but the theme wouldn't show up in the dropdown.

Erik Aybar
Erik Aybarinstructor
~ 4 years ago

Hi Venkata,

Have you restarted WebStorm? If you are still not seeing it, can you confirm that it exists in the expected directory. It sounds like you are on Mac OS X and have successfully downloaded via curl -O from your previous comments. Try entering the colors directory and listing contents via:

cd /Users/YOUR_USERNAME/Library/Preferences/WebStorm2016.3/colors
ls

and make sure that the expected color is there. For example, here is my output from the above commands

$ ls

Base16 Ocean.icls             Earthsong _ EA.icls           One Dark.icls                 Snappy Light - Erik.icls      github.icls
Default - Erik.icls           Monokai _ EA.icls             Peacocks In Space _Erik_.icls WarmNeon _ EA.icls            peacocks-in-space.icls
Default _Erik_.icls           One Dark _Erik_.icls          Relax Your Eyes.icls          earthsong.icls                snappy-light.icls
Venkata Janapareddy
Venkata Janapareddy
~ 4 years ago

Hey Erik, Thanks for the reply!

I have restarted Webstorm multiple times and I also see that it got downloaded to the colors directory! But, it wont show up in Webstorm>Preferences>colors & fonts>Scheme for some reason.

Venkata Janapareddy
Venkata Janapareddy
~ 4 years ago

Hi Erik,

I previously installed Material theme, I uninstalled it, I deleted the peacock in space theme too, downloaded it again and restarted webstorm. It is showing up now. Weird!!!!

Thanks for your help. :)