I’ve inherited a large set of button icons at work, which I’d like to use in another project, but with a different button background. The trouble is that the original files have been lost in history, so all I have is the flat PNGs.
What I’ve managed to do is extract a blank button background. Looking at this from a developer point of view, what I’d like to do is “diff” two images (or two layers on a same image), and turn the pixels which are identical in both images transparent.
For example, out of these two pictures I would like a transparent image/layer with just the spade on it:
I realize that the result wouldn’t be perfect, especially around blurred edges on the icon, but it would get me a long way. I have about 50 of these, in three button states = 150 images, so bonus for any method which would allow me to play with tolerance.
I’m mainly using Paint.NET, but any free piece software would do. I don’t have access to photoshop.
EDIT
I suddenly remembered that I’m actually a software developer and not a graphic designer, so I wrote a program to do this in batch. The C# source code can be found at: http://pastebin.com/mKmtdHT4
Problem solved for me, but I’ll leave this open for some time in case somebody has a more generally applicable solution to pass on to other people who have the same problem.
Answer
This is relatively easy with ImageMagick‘s compare:
$ compare -compose src Background.png Icon.png diff.png
With your files, this would result:
Although, convert gives you a broader control on the output, e.g. the threshold. Here a B&W version is created, which is more usable for masking, and then the spade is extracted using the created mask:
$ convert Background.png Icon.png -compose difference -composite \
-separate -background black -compose plus -flatten \
-threshold 0 diff.png
$ convert Icon.png diff.png -compose CopyOpacity -composite spade.png
⇒ 
Attribution
Source : Link , Question Author : fencliff , Answer Author : Jari Keinänen
