I always seem to forget how to fade the edge of an image in the gimp… so here’s a note-to-self:

      select the area to preserve; IF YOU WANT THE EDGE TO FADEOUT, SELECT A BOX JUST INSIDE THE ENTIRE IMAGE; YOU CAN ALSO USE THE MAGIC WAND TO SELECT AN AREA, AND SHRINK AND GROW AS NEEDED
      SELECT->FEATHER, GIVE IT ABOUT 5 PIXELS; THIS APPEARS TO DO NOTHING BUT PUT A BIT OF ROUNDED CORNERS ON YOUR SELECTION, WEIRD EH?
      NOW, INVERT THE SELECTION, AND HIT DELETE – vioala, GIMP FADES OUTWARD. YEs, IT’s weird!

soRRY ABOUT THE caps, IT’S HONESTLY EXACTLY how the letters are spewing out on my macbOok prO, Now That i”ve Mananged to get it humming and then spill a full glass of water on it. AWESOmENEsS. AND that”s With another Keyboard attacheD. aPPARENTLY THE MAIN KEyboard is flicking THe shift KEy on aND OFF LIKE A CHRISTmAS TrEE. AND IT’S not EVen ThaNKSGIving Yet.

I cloned this site for my pop’s blog, and I had to change the colors in the rounded corners graphics. I needed to set the color outside the corners to the site’s background color, while colorizing the inside. Gimp once again made it a snap.

  • Get the “http” RGB colors for the before-and-after corner colors
  • Open the image, convert to RGB, select all
  • Colors->Map->Color Range Mapping
    This is sweet – use beforecolor-to-white above, and aftercolor-to-white below.
  • Select the magic wand, and Ctrl-click in the corner to exclude only the solid corner color
  • I used Colors->Hue Saturation->Lighten to lighten everything but the corner (which had to match)

UPDATE: In the Layers tab, you can directly change the percent transparency of any layer with a slider. Doh!

No need for any of this any more…

Here’s a cheap fast way to increase transparency of an image in the Gimp. Script-fu to the rescue!

NOTE: I always use the png format when I want transparency. Firefox and IE7 handle png nicely.

  • Select the region to be made “more transparent” (or just Select->All).
  • Select Script-fu->Selection->Fade Outline.
  • Set the Border size large enough to cover the selection.
  • Set BOTH the fade from % and fade to % to the desired increase in transparency.

Sure, it’s hacky, but it works BEAUTIFULLY.

Two-second text rendering tutorial: (continued…)

The PNG format is nice because it’s supported by Firefox and it has real alpha-based transparency. This looks great no matter WHAT color your background is:

I have been working on improving the alpha on the category images here, specifically the MythTV and Linux-projects category images. Here’s how (continued…)