JetBrains New UI Themes for Zed
This is a dark theme for the Zed editor based on the UI theme and editor colors from the "New UI" for the JetBrains IntelliJ platform. Currently, only the new "Dark" theme is implemented, but I plan to eventually add support for the "Light" and "Light with Light Header" themes as well.
The colors used for syntax highlighting should be an exact match to IntelliJ. However, some elements won't be highlighted in exactly the same way due to differences in the syntax queries.
The UI elements are a bit trickier, but I believe this comes close enough to at least be in the spirit of the JetBrains New UI. The Zed theme system is relatively new, and is still somewhat limited compared to the complexity of IntelliJ or even VSCode. The documentation is also very minimal at this point, so determining which theme color controls a particular UI element, or finding all the different ways that a particular color might be used, still requires a lot of trial-and-error and searching of the Zed source code.
The Zed editor and its theme system are still evolving rapidly, so the behavior of the theme colors could change at any time. If you notice an unexpected change in the appearance after installing a Zed update, please create a GitHub issue, preferably including screenshots of both the before and after appearance.
- Open Zed
- Use the command palette (
zed: extensions
) or theZed > Extensions
menu item to open the Extensions view. - Search for "JetBrains New UI Theme", then click
Install
.
- Download the intellij-newui.json theme file.
- Put the theme file into your
~/.config/zed/themes/
directory.
- Use
cmd-k cmd-t
, the command palette (theme selector: toggle
), or theZed > Settings... > Select Theme...
menu item to open the theme selector. - Select the "JetBrains New Dark" theme.
- Starting in Zed 0.137.2, there was a change that broke the ability to properly theme some of the UI buttons. This affects the hover style most, but also changes some of the normal button backgrounds. I opened Zed issue #12592 for the hover styling.