Colors, Inkscape, and Mac-ness

25 04 2007

So I’ve been back on some web interface design stretches lately. Working alot with SVGs in Inkspace and I’ve totally found my medium of choice. I got hooked on raster graphics playing with Photoshop more than ten years ago. It was so expensive I never ventured into Illustrator but have been wishing I would have lately. Vectors seem to fit my brain better even though I’m not super mathy.

To get my rounded-cornered Web 2.0 AJAX soaked interfaces on point I’ve been creating buttons, icons, and layouts in Inkscape, an open source Scalable Vector Graphic editor. I’ve gotten the hang of it and now that Firefox and other browsers are providing native SVG support, I look forward to doing some cool stuff with it. One idea I’d like to chase down eventually is defining the relationships between the colors in a web skin, as opposed to the actual colors. Then we could provide a user preference screen to adjust some sliders so they can set the base color, hue, saturation, etc and the rest of the interface would dynamically re-render all the graphics elements. I think we’d swamp a browser trying to update every graphic SVG element on-the-fly, but some server-side love could handle the job.

Anyways the thing I was playing with tonight was simply importing and exporting colors to get them where I need them. I’m using Color Schemer Pro to work with colors. It makes mixing, matching, and saving colors in multiple formats simplio. When creating skins, I often embed a .gif of the colors so you can grab them via Colorzilla, since most people don’t like to memorize the hex codes. (I’ve really been into #5D07B0 lately, but #6700B8 is nice too.)
I’d like to take a color scheme and turn it into a palette I can use directly in Inkscape. Color Schemer Pro (CSP) can export as .gif, .html, .aco, ai, .txt, …, .act, and .xml. Very cool except Inkscape doesn’t read any of these. So….the solution from tonight is to:

  1. Export from CSP as a .act file
  2. Import as new swatch in GIMP
  3. Look in your ~/.gimp-X.X/palettes where GIMP will have converted and saved a .gpl file
  4. Copy the .gpl file into Inkscape into the /Contents/Resources/palettes
  5. Open Inkscape. Ta-da! Your palette is there!

The imported palette is missing the caption for each color so it is blank if you mouseOver it, but you can edit the .gpl file if you really want to. It’s really just a text file with some RGB color codes in it.

May all your pixels come true.


Actions

Informations

Leave a comment

You must be logged in to post a comment