Custom Zenburn Theme for Sublime Text 2

For a while now, I’ve been using Notepad++ with a customized version of the Zenburn theme, which was originally created for Vim.

This week I finally started fiddling around with Sublime Text 2, and I like what I’ve seen. Although I like the default Monakai theme, I prefer my old customized version of Zenburn from Notepad++. So I forked this Zenburn repo and made my alterations.

Below are some screenshots.

Editing HTML:

Editing HTML with Zenburn

Editing CSS:

Editing CSS with Zenburn

Editing JavaScript:

Editing JavaScript with Zenburn

My version is different from the usual Zenburn theme in two ways: 1) The background is darker, which I think looks much better; and 2) the HTML/CSS/JS comments are in gray instead of green, and they’re italicized. I think this looks much better for scanning.

Install on Sublime Text 2

If you want to try out this theme, just navigate to your packages folder, then to the “Color Scheme – Default” folder and clone the repo with this command:

$ git clone https://github.com/impressivewebs/zenburn.git

Or just do it using whatever tool you’re using to clone repos from GitHub. Notice that I said to go into the “Color Scheme…” folder. When I cloned the repo into the packages folder directly, I ran into this bug. The problem went away when I removed the theme and then cloned it into the “Color Scheme…” folder instead. If anyone has a better suggestion for this, please comment.

If you want this theme for Notepad++, here’s a gist with the XML data from my customized version of Zenburn. Just save it as an XML file in your themes folder, and make sure you’re running Notepad++ as an administrator in Windows, otherwise it won’t let you save it as the default theme.

Advertise Here

13 Responses

  1. I have always used Cobalt with every code editor on every system. I’m fairly sure I read somewhere that a bluish background causes less eyestrain?

    • Agreed, Cobalt is nice, and you might be right about it being easier on the eyes. I like the fact that both Notepad++ and Sublime Text 2 let you easily bump up the font size, which I think is more important for eye strain.

      In both editors you just hit CTRL with the plus sign or up on the mouse wheel. For some reason, that feature wasn’t available on Sublime Text 1, which is the main reason I rejected it the first time I tried it.

    • Michael:

      I haven’t been able to turn away from Cobalt since I discovered it on Textmate so many years ago. It’s just so easy on the eyes. And has the best color coding form HTML/CSS/JS files.

  2. Lavabeams:

    If you haven’t just generally had a look at Package Control already you should do so it an amazing addition to Sublime Text 2 and makes life so much easier.

    If you have you should look at adding your git repo to the Package Control list!

    I like the theme also, however I have just moved to using light backgrounds and dark foregrounds and am quite enjoying the switch.

  3. Brad:

    I too am a fan of the Monakai theme. I like the looks of what you have done and think I will give it a shot. Do look into the package control like Lavabeams said, great idea!

  4. AB:

    if you want to edit your theme futher you can try my new tool tmThemeEditor http://tmtheme-editor.herokuapp.com

  5. Louis, looks like you haven’t seen any of true possibilities of Sublime Text 2 yet. First of all, forget about manually cloning extensions for it and use Package Control: http://wbond.net/sublime_packages/package_control .

    And then check out these amazing (and free!) tutorials by Jeffrey Way, and you will realise how *sublime* this editor really is http://net.tutsplus.com/articles/news/perfect-workflow-in-sublime-text-free-course/

Leave a Reply

Comment Rules: Please use a real name or alias. Keywords are not allowed in the "name" field. If you use keywords, your comment will be deleted, or your name will be replaced with the alias from your email address. No foul language, please. Thank you for cooperating.

Instructions for code snippets: Wrap inline code in <code> tags; wrap blocks of code in <pre> and <code> tags. When you want your HTML to display on the page in a code snippet inside of <code> tags, make sure you use &lt; and &gt; instead of < and >, otherwise your code will be eaten by pink unicorns.