ImageMagick, or how to manipulate images easily from the command line.

Hello there!

In the web world, images are everywhere. Whether to illustrate an article, create a banner or retouch a photo, images are an essential part of the web. To manipulate them, we often use software such as GIMP, or Inkscape (which is great for PNGs). But it's also possible to do lots of things with the command line, and the Linuxian in me is delighted with this option?

The really cool thing about using the CLI is that you can automate image processing, for example, by writing just once "hold for theI want to add a watermark" and then, as soon as you need to do it on an image, all you have to do is run your command (or bash script).

And of course, since it's CLI, you can use it on a server (well, who uses a graphical interface on a server? Who does?).

In this article, we'll be going back over the basics, namely JPEGOptim and optiPNG, but that's just for starters... the "heavy" stuff comes later.

Are you ready? Let's get started!

Basic tools: JPEGoptim and optiPNG

They're very well known and used by development tools such as theLiipImagineBundle, but I think it's a good idea to go over them briefly.They're well known and are used by development tools such as "LiipImagineBundle", but I think it's a good idea for beginners to take a brief look at them (plus it'll get you looking for information on image compression, so we're good!)

JPEGoptim: compressing JPEG files

The JPEG format is the most widely used "lossy" format, and although it's beginning to be replaced, it's still very present on the web. The essential tool for compressing a JPEG in CLI is Jpegoptim, a small example of its use?

"jpegoptim -t -m80 --all-progressive image.jpeg"

Here, the -t option preserves the image's date and time information, and the -m80 option reduces image quality to 80%.

The task in adjusting quality is to find the right weight/quality ratio, so it's up to you?

What about "-all-progressive"? I'll leave you to find out... ?

optiPNG: optimizing PNG files

PNG is also aging, but it's still used today, and its compression is far less than that of JPEG, since it's basically a "lossless" format, even if it "can be" (https://pngquant.org/). Let's stick to the basic principle that PNG is lossless. (for those of you who haven't kept up, a lossless format doesn't degrade image quality, unlike a lossy format).

"optipng -o2 image.png"

In this example, the -o2 option defines the optimization level, which ranges from 0 (fastest) to 7 (slowest). A higher optimization level may give better results, but processing time will be longer.

ImageMagick: a powerful tool for image manipulation

Now that we've talked about the basic tools for image optimization, it's time to take a look at ImageMagick. It's a comprehensive set of tools for manipulating images from the command line.

ImageMagick is, of course, open source.

It's really very complete and can also be used through your favorite programming languages.

How do I install ImageMagick?

On Debian and Ubuntu, as simple as ever: "sudo apt-get update && sudo apt-get install imagemagick".

On macOS, as always, it's best to use HomeBrew: "brew install imagemagick".

And finally, for Windows, this is where it happens

Note that ImageMagick comes with several commands, such as "convert" or "composite".

Some examples of iMageMagick usage

Resizing an image
I often need to resize images to adapt them to different media (phone, computer or tablet). We'll use ImageMagick's "convert" command to do just that.

"convert input.jpg -resize 800x600 output.jpg"

In this example, I resize the "input.jpg" image to a width of 800 pixels and a height of 600 pixels, then save it as "output.jpg".

Embedding a logo in an image
Sometimes I add a logo to images to give them a watermark. To do this, I use ImageMagick's "composite" command:

"composite -gravity southeast -geometry +10+10 logo.png image.jpg output.jpg"

Here, I overlay "logo.png" on "image.jpg", positioning the logo in the bottom right-hand corner of the image (southeast), with a 10 pixel margin from the edges. The final file is "output.jpg".

Converting an image to black and white
When I want a vintage look, I convert my images to black and white. ImageMagick makes it so easy? :

"convert input.jpg -colorspace Gray output.jpg"

This command converts "input.jpg" into a grayscale image and saves the result as "output.jpg".

Create animated GIFs
Want to create your own mini cartoon? Why not do it with GIFs?

Simply use the "convert" command, which we've already used, like this:

"convert -delay 100 -loop 0 image1.jpg image2.jpg image3.jpg image4.jpg animated.gif"

Here, I specify a delay of 100 hundredths of a second between each image and an infinite loop for the animation. And save the result in the file "animated.gif".

And much, much more...
These examples are just the tip of the ImageMagick iceberg. The tool offers a multitude of other possibilities... In the next section, we'll simply create a simple Bash script, for "mass image manipulation".

Using ImageMagick in bash scripts

ImageMagick on its own is already something, but now imagine using it with bash scripts. The idea is to be able to make modifications on several files at the same time, ultra-practical when you have a lot of images to process in the same way.
Let's take a look at some bash scripts that can be used to perform "mass" operations

Resize all images in the current folder
Nothing too complicated, just call the ImageMagick command for each file in the current directory.

Cluster a logo on all images in a folder
Instead of doing it in the current directory, we're going to use only the JPG and PNG images in the "Input" sub-directory.

Conclusion

ImageMagick allows you to do a lot of things. When I discovered it, I said to myself "this is going to make my life so much easier"...
And even in this article, I've only covered a very small part of it. Take a look at all the possibilities on the project's website .
That's all for me for this week, see you next week?