Cupcake, a color tool for web and app designers

[Tweet]

I’ve been beta testing an app called Cupcake for what seems like forever. A while ago it didn’t look like it was going to make it to the App Store. It just did, though, and I think it’s of interest to anybody who’s ever had to code a color.

Cupcake lets you select text containing a color code in your HTML, CSS, or Cocoa document (or just about anywhere you can select text) and hit a key combination to pop up a picker. You can then adjust or replace the color from the picker or your own saved colors, and replace the original text with the new color. It’s a huge timesaver when working in editors and IDEs that don’t offer previews of the color codes (which is 90% of them).

By default, the key command is ⌘⇧8 to replace the color. You can also insert a color without a selection using ⌘⇧7. These are System Services, and you can adjust the shortcuts using System Preferences (or, my preference, Services Manager). Because they run as Services, you don’t need to have Cupcake running all the time. It will just launch when you run the Services.

You can choose to insert your colors as hex, rgb(a), hsl(a), NSColor (calibrated red, device red, calibrated hue, or device hue), UIColor (red or device hue), or CGColor.

Cupcake stores your color history, and you can add your own custom colors to the “My Color” section for easy retrieval across a project.

Grab Cupcake on the Mac App Store for just $2.99 right now. It’s an amazingly handy tool for web designers and Cocoa developers.