Creating Custom Themes for IntelliJ Platform IDEs

Beginning with the 2019.1 release, Custom UI Themes can be provided by 3rd party authors to customize the whole Look and Feel of the IDE.

customtheme

Customization is done by packaging a Theme descriptor file (JSON format) as a plugin. Most themes will change the colors of the UI, but replacing icons, changing the appearance of borders, and bundling editor schemes are also possible. By the way, the bundled “ High contrast” theme uses the same mechanism.

After uploading the Custom UI Theme plugin to the JetBrains Plugin Repository (plugins.jetbrains.com), it can easily be installed right from the IDE’s plugin manager and activated via Preferences | Appearance & Behavior | Appearance “Theme” combo box.

darktheme

Get started today by following the detailed tutorial we’ve added to the IntelliJ Platform SDK docs that will walk you through the process of creating a custom Theme. As a reference, you can also take peek at the provided sample Theme plugin.

This entry was posted in IntelliJ Platform. Bookmark the permalink.

19 Responses to Creating Custom Themes for IntelliJ Platform IDEs

  1. Pingback: Brighten up Your Day – Add Color to IntelliJ IDEA! | IntelliJ IDEA Blog

  2. Tom Fagerland says:

    Expecting Solarized Dark theme within the end of the weekend. If not, I’ll have to create it myself 😉

  3. How do you change the color of ‘Test editor tabs’. For a regular Editor Tab it’s simply

    "EditorTabs": {
    "active": {
    "foreground": "#839496",
    "background": "#073642",
    "underlineColor": "#93a1a1"
    },
    "inactive.maskColor": "#073642FF"
    },

    But this has no effect on tabs that are highlighted green due to being a test resource. Looking over the element using LAF Defaults and UI Dropper, I don’t see any difference between a ‘test’ tab and a ‘regular’ tab.

    Also, @Tom Fagerland, I’m on it 😉

    • Olga Berdnikova says:

      The test editor tabs color is another setting. It is managed with the “File Colors” feature. There is a UI for that: open the Settings / Preferences dialog, go to “Preferences | Appearance & Behavior | File Colors”. Here the two default scopes are preassigned with colors: non-project files are yellow, tests are green.

      The default scopes are created automatically. The green and yellow colors are also default. But pleople can change them to other colors. There are 6 predefined file colors — doulbe-click the color in the settings and you’ll see a dialog where to change that.

      File colors are also used not only in the editor tabs but also in the Project tool window, Search Everywhere popup and some other places where files appear.

      See more on that in https://www.jetbrains.com/help/idea/settings-file-colors.html

      To change File Colors in a color theme plugin, use these keys:

      “FileColor”: {
      “Yellow”: “#45243b”,
      “Green”: “#213d37”,
      “Blue”: “#1f3557”,
      “Violet”: “#2a2754”,
      “Orange”: “#402e23”,
      “Rose”: “#4a2d59”
      }

  4. Jonathan Channon says:

    Will people be able to see a preview of what the themes look like when the author uploads them?

  5. Rick Yentzer says:

    Can’t wait for this feature to be available on all of Jetbrains IDE’s!

  6. bvat says:

    Holy crap, that purple is amazing! https://i.imgur.com/Qy9Cw58.jpg

  7. Steven Sacks says:

    I’m using Webstorm 2019.1.1 and there is no option in the New Project for a plugin project as outlined here in the documentation:

    http://www.jetbrains.org/intellij/sdk/docs/basics/getting_started/creating_plugin_project.html

  8. Max Wright says:

    Is it possible to have a live preview while creating the theme ?
    It’s REALLY boring to start a new Intellij instance every time.

  9. David Petrla says:

    Is it possible to have two or more instances of IDEA running simultaneously with different themes?

    I work on multiple projects and this would accelerate my orientation and concentration when switching between them.

  10. Yacine Mhd says:

    is it possible to create a theme with a glowing effect, similar to this vscode theme https://marketplace.visualstudio.com/items?itemName=RobbOwen.synthwave-vscode

Leave a Reply to Rick Yentzer Cancel reply

Your email address will not be published. Required fields are marked *