How to merge images in command line? [closed]

I would like to try the CSS Sprite technique to load a few thumbnails as a single image. So I need to "merge" a few thumbnails in a single file offline in the server.

Suppose I have 10 thumbnails of the same size. How would you suggest I "merge" them from Linux command line?


Solution 1:

You can also try ImageMagic which is great for creating CSS sprites. Some tutorial about it here.

Example (vertical sprite):

convert image1.png image2.png image3.png -append result/result-sprite.png

Example (horizontal sprite):

convert image1.png image2.png image3.png +append result/result-sprite.png

Solution 2:

You can also use GraphicsMagick, a lighter and faster fork of ImageMagick:

gm convert image1.png image2.png -append combined.png

A simple time comparison of merging 12 images:

time convert image{1..12}.jpg -append test.jpg

real    0m3.178s
user    0m3.850s
sys     0m0.376s

time gm convert image{1..12}.jpg -append test.jpg

real    0m1.912s
user    0m2.198s
sys     0m0.766s

GraphicsMagick is almost twice as fast as ImageMagick.

Solution 3:

Use the pnmcat of the netpbm-package.

You probably have to convert your input files to and fro for using it:

pnmcat -lr <(pngtopnm 1.png) <(pngtopnm 2.png) | pnmtopng > all.png

EDIT: As user Hashbrown pointed out in a comment, this might have trouble with different sizes and/or transparency in the PNGs. To circumvent that he came up with this solution (just copying it here because the Q is closed and new answers cannot be added):

pnmcat -jleft -tb \
    <(pngtopnm image139.png) \
    <(pngtopnm image73.png) \
| pnmtopng \
    -alpha <(pnmcat -black -jleft -tb \
        <(pngtopnm -alpha image139.png) \
        <(pngtopnm -alpha image73.png) \
    ) \
>test.png

I didn't test that solution, though.