Using Gimp

I mentioned before I’d downloaded Gimp, a free paint-style program, to help make graphics for my apps.  I’ve struggled to use it for anything much though, but last night I was able to make a simple tab-bar icon.

To make a tab-bar icon in Gimp:

  • Choose File -> New an make a new 60×60 (for retina) image.
  • Choose Layer -> New Layer and choose layer fill type “Transparency”.
  • Delete the original background layer over in the “Histogram” window: drag the old layer from its position about halfway down the window to the tiny garbage bin in the bottom right corner (on my Mac this is half covered by the window-resizer).
  • Now paint into this layer with black where you want the image.  You should only use one colour.  I tried using black and white, and only union of the two shows up in the tab bar.
  • File -> Export the picture.

To take an existing image and set a background colour:

  • Use the magic wand tool, which selects regions by colour.
  • Select the coloured region you want to make transparent.
  • Choose Layer -> Transparency -> Add Alpha Channel (if you can).
  • Choose Edit -> Clear.

I expect you can use this directly as a tab bar icon now – just the remaining colour information will be ignored.  But I have yet to test this.

One thought on “Using Gimp”

  1. Speaking of tabs, I noticed a quite elegant way of creating tabs with CSS only that I hadn’t seen before. Have a look at, select Android Apps and pick any one.
    The tabs overlay one another, are semi-transparent, and have a sloping edge.

    It’s done with a very thick (24px) bottom and right border of different colours.

Comments are closed.