Image concatenation with Imagemagick

Concatenation of multiple images can easily be done with tools such as GIMP, but easily doesn’t always mean fast. So let’s assume that we want to tile some images, e.g. to create an image sprite we will use on our webpage. And assume we want to do it fast.

So, instead of copy-pasting all images into the sprite, or opening them all as layers and moving them, and opening, and moving, and so on, we’re going to use a command line tool, that will do all the work for us.

We will use an extremely powerful tool: Imagemagick, so if you don’t have it installed yet, please do it now.

The simple way

The convert program with append option, allows you to append images one after another, vertically or horizontally. So:

convert -append image_a.png image_b.png image_c.png output.png

will append images vertically:

Result of vertical append

and

convert +append image_a.png image_b.png image_c.png output.png

will append them horizontally:

Result of horizontal append

But if you’d like to create a grid with multiple rows and columns, you’d have to concatenate the output images accordingly. But you may achieve the same effect using montage command.

The more powerful way

With montage you can easily combine many images into grids with specific number of columns and rows.

Exacly the same as with convert command, can be done by:

montage -mode concatenate -tile 1x image_a.png image_b.png image_c.png output.png

and

montage -mode concatenate -tile x1 image_a.png image_b.png image_c.png output.png

respectively.

But to create e.g. a 3x2 grid (3 columns, 2 rows), you just execute a command:

montage -mode concatenate -tile 3x2 1.png 2.png 3.png 4.png 5.png 6.png output.png

which gives you an output.png, made of 1.png, 2.png, 3.png in first row, and 4.png, 5.png, 6.png in second row tiled together:

Result of montage

Imagemagick is a great tool to save up time doing many operations on images. Concatenation is only a tiny fracture of percent of its possibilities.