Friday, March 16, 2012

Setting up a Color Picker for Sublime Text 2 (on Windows)

Sublime Text 2. You already know so I don't need to say it. Anywho, in Visual Studio one of my favorite extensions is devColor for picking hex colors in my stylesheets. In Sublime Text 2 you need to install one, it's not there by default sadly.

Here are instructions on how to do it step by step.
  1. Fire up Sublime Text 2
  2. Press CTRL+` (the key above the TAB key)
  3. You'll see a console window take up the bottom portion of the window. Paste the following block of code there
  4. import urllib2,os; pf='Package Control.sublime-package'; ipp=sublime.installed_packages_path(); os.makedirs(ipp) if not os.path.exists(ipp) else None; urllib2.install_opener(urllib2.build_opener(urllib2.ProxyHandler())); open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read()); print 'Please restart Sublime Text to finish installation'
    (This will install the Sublime Text 2 Package Control system which is similar to Gem, NuGet, NPM, etc.)
  5. Close Sublime Text and reopen it
  6. Press CTRL+SHIFT+P to open the Command Palette
  7. Start typing in "Package" and select the Package Control: Install Package option and hit Enter
  8. The dialog changes to a list of available packages. Type in "Color" and select ColorPicker
    (Credit goes out to Weslley Honorato for creating the package)
  9. No restart of Sublime required this time around. It's ready to use
  10. Open a stylesheet or an area where you want to insert a hex color
  11. Press CTRL+SHIFT+C to bring up the color selection dialog
  12. That's it!

1 comment:

  1. Hello!
    Please also take a look at Color Tools: http://www.color-tools.com/
    This is a color picker (and not only color picker) which can be used with Sublime Text.

    ReplyDelete