Sublime Forum

Hex to HSL Color Converter

#1

Adds a command to Sublime Text 2 that converts hexadecimal colors to HSL colors. For example, #bada55 becomes hsl(74, 64%, 59%).

I work in Sass most often for my CSS and much prefer HSL colors (Brandon Mathis gives a good explanation why HSL rocks). When converting a CSS file to Sass, I usually move the colors to HSL, but that can be tedious even with great tools like HSL Color Picker and ColorSnapper. This plugin makes it much easier.

Usage
Put the cursor on or select one or more hex colors (three character colors are OK)

Press shift+ctrl+U.

The colors will be converted to a properly formated CSS HSL color.

Installation
You can install using Package Control.

The code is in on GitHub.

0 Likes
#2

I have been updated the main sublime-menu that add an extra space to the Edit menu.

The file is located at: Sublime Text 2\Packages\Hex to HSL Color Converter\Main.sublime-menu

You forgot to add “caption”: “-”, to id item.
Should look like:

{
    "id": "edit",
    "children":
    
        { **"caption": "-"**, "id": "hextohsl" },
        { "command": "hex_to_hsl", "caption": "Convert Hex to HSL" }
    ]
}

]

0 Likes
#3

Thanks. The extra space didn’t appear on my Mac so I didn’t know it was a problem. I applied your fix and pushed it.

0 Likes
#4

Thank you so much for creating such a useful plugin, I’ve been using it regularly since I discovered it.

I have two feature requests: would it be possible to add an option to convert to HSL without the spaces between the numbers? And secondly would it be possible to be able to convert HSL back to Hex?

Thanks again and keep up the excellent work!

0 Likes