Want VIP access? Get the latest tutorials, videos, giveaways and more!

×

cobalt2: a theme for Sublime Text

Update: November 2014 – these theme has received a major UI upgrade for new Sublime Features and editor tweaks.

I love text editor colour schemes. I’ve tried dozens of them over the years but always found myself coming back to trusty old cobalt. I liked this theme quite a but but I didn’t love it. So, over the years I’ve tweaked and tuned cobalt into a theme that I am very happy with. Its easy on the eyes, works well across many languages and takes note of those little UI elements like the caret, searches and bracket matching.

I have had quite a few friends use my theme and they seem to be sticking with it. So, I’ve decided to release it to the masses. To download it, head on over to the github repo. As always, would love to hear any feedback you may have :)

Quick aside: I wrote a book on sublime text which comes along with a video series. If you like my themes and blog posts on Sublime Text, you will love this!

#cobalt2
A Sublime Text theme based on our old blue friend cobalt.

A refined colour scheme that is easy on the eyes and takes small UI elements into account. Includes full sublime theme (sidebar, search, tabs, etc…) as well as support for SublimeLinter, git diffing and a growing number of plugins.

See below for examples. Read more at http://wesbos.com/cobalt2-theme-sublime-text-2/

Installation

With Package Control

  1. Open package control toolsCommand Palette and type Install Package
  2. Search for Cobalt2 and hit enter
  3. Lastly, open PreferencesSettings - User. Add the following two lines:
"color_scheme": "Packages/Theme - Cobalt2/cobalt2.tmTheme",
"theme": "Cobalt2.sublime-theme",

If these are the last two lines of your settings file, make sure to omit the trailing ,

Screenshots

Sidebar Icons

Dirty Tab and Selected Tab

Indentation Guides — Guide, Stacked Guide and Active Guide

Use "indent_guide_options": ["draw_normal", "draw_active"] for this

GitGutter Support

Autocomplete

Command Palette

GoTo Anything

Tabs, Spaces and Comments

Folding Lines

Searches

Highlighted Line

JavaScript

CSS

PHP

Ruby

Python

Markdown

Contributing

While cobalt2 covers all languages, I write mostly JavaScript and CSS so I welcome any additions for other languages.

Thanks

Some icons from Soda Theme by Ian Hill

Kyle Knight for pushing cobalt2 past the code screen and styling the entire editor.

Seti UI Atom theme for the sidebar icons

Official Colours

Yellow: #ffc600
Blue: #193549
Dusty Blue 35434d
Dark Blue: #15232D

You may also like:

Cobalt2 Theme for iTerm https://github.com/wesbos/Cobalt2-iterm

Sublime Text Power User Book

This entry was posted in Sublime Text. Bookmark the permalink.

32 Responses to cobalt2: a theme for Sublime Text

  1. Thanks.

    I love using Cobalt especially with a Monaco 16pt. font.

  2. Very, very nice. Thanks for releasing it. Looking forward to your book.

  3. Francesco says:

    Just installed it, i have to say that it’s “relaxing”, thanks for sharing :D

  4. Pingback: Bookmarks for January 23rd | Chris’s Digital Detritus

  5. Chad says:

    just installed your color scheme and I must say..I was pulling my hair out trying to find a color scheme that I would like. but yours is wonderful and brilliant. Thanks for this so much! My eyes thank you too!

  6. Jay says:

    Really nice theme, however my sidebar always stays light grey no matter which theme I use. Anyone have any ideas?
    thanks again!

    • wesbos says:

      Make sure you put both of the lines in your settings file:

      "color_scheme": "Packages/Theme - Cobalt2/cobalt2.tmTheme",
      "theme": "Cobalt2.sublime-theme",

      The first one colours your code, the second line colours the editor chrome (things like the sidebar)

  7. leo says:

    amazing theme! gonna be my default theme :)

  8. oluc says:

    Very good theme, adopted!
    Thank you!

  9. wilson sy says:

    how do i download this theme?

    i am confused with this step: Drop in the Theme – Cobalt2 directory here (Right into /Preferences/)
    where can i get the theme-cobalt2 directory?
    The other site (github) says download the ‘repo’. what is it?

    Thanks.

    • TGU says:

      Currently, under ST3, packages installed with “Package Control” are stored as compressed archives. Under Windows, please click the ‘Preferences -> Browse Packages’ and once the explorer window pops up, select parent directory of the current one (usually “Sublime Text 3″). There you’ll find a sub-directory called “Installed Packages” where you can see the package archive you’re looking for, i.e. ‘Theme – Cobalt2.sublime-package’. Using any zip like utility you can access all the stuff stored there.

      I’m not sure about MAC (I’m not using it) and Linux (where I still have ST2 installed). I hope it helps.

  10. JJ says:

    Love the theme however the sidebar, while styled properly doesn’t have the icons. Is there something extra that is needed for them to show up?

    Thanks

  11. Steven says:

    My side bar icons don’t show up. What should I do?

  12. Zach says:

    I can’t get the “Sidebar Icons” to work? I installed it via package control. The theme and color scheme work, but no “Sidebar Icons”.

    • wesbos says:

      Use "theme": "Cobalt2.sublime-theme" in your settings file

      • Julien G says:

        Hello,

        First of all, thanks a lot for this awesome theme.
        However, as Zach, I cannot find anyway to display the icon sidebar.
        I have this User/Preferences.sublime-settings file (including the lines mentioned above):
        {
        “font_size”: 11,
        “ignored_packages”:
        [
        “Vintage”,
        “LiveReload”
        ],
        “color_scheme”: “Packages/Theme – Cobalt2/cobalt2.tmTheme”,
        “theme”: “Cobalt2.sublime-theme”,
        “translate_tabs_to_spaces”: true,
        “word_separators”: “/\\()\”‘-:,;~!@#$%^&*|+=[]{}`~?”
        }

        If it can help, I’m using Win7 and Sublime Text 2.
        Thanks again :)

      • tilapiatsu says:

        Hello!
        I have properly added “theme”: “Cobalt2.sublime-theme” in my setting file but the Sidebar Icons won’t show up !

        Any clue ?

      • Pranav says:

        I have added `”theme”: “Cobalt2.sublime-theme”` in my settings file, and can see it take effect in the search bar, chrome etc. But the icons dont appear. Have tried restarting ST too.
        Any pointers?

  13. Monting says:

    Thanks for the great work!
    For anyone on ST3 the icons don’t show, make sure you’re on build 3065

    http://www.sublimetext.com/3
    build 3065 – “Added sidebar icons”

  14. Guario says:

    I really like the color scheme for everything but HTML. I’m like you that I deal mostly in CSS and JavaScript but I do a lot of HTML markup and there is just not enough element differentiators. If that would be added I would use it in a heartbeat. Still using the theme, just not the color scheme.

  15. Bob Walsh says:

    Excellent job on Cobalt2! Like most developers, I’m extremely fussy when it comes to SB themes – Cobalt 2 sets a new standard.

  16. Pingback: Big Screen Sublime Text 3 – Cobalt2 theme is awesome. | 47hats.com

  17. Les says:

    I’m on Windows 7, using ST3, build 3065, and I’ve added to settings – user:

    “color_scheme”: “Packages/Theme – Cobalt2/cobalt2.tmTheme”,
    “theme”: “Cobalt2.sublime-theme”,

    But I don’t see the icons.

  18. Bishoy A says:

    I call that a “FULL” Theme for sublime :) We rarely come across those. And I am already a cobalt fan!

    Thanks for making it.

  19. Pingback: Cobalt2 Sublime Theme - Bishoy A

Leave a Reply

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>