How to Convert Images to WebP Using the Command Line

Introduction

WebP is a modern image file format, free and open-source, developed by Google to support lossy and lossless compression, aiming to optimize image display on websites.

Images are responsible for the majority of data transferred on most websites, making image file size a crucial factor for fast and smooth browsing, especially on mobile devices.

Images in WebP format are significantly smaller in size than those in JPG format, even at similar levels of lossy compression, while maintaining the same visual quality. Additionally, unlike JPG, WebP supports transparency (alpha channel), a feature previously exclusive to formats like PNG, but with the advantage of generating considerably smaller files.

This combination of smaller file size and greater flexibility makes WebP an excellent choice for improving the performance and quality of websites on the internet.

Installing cwebp on Linux

The cwebp command will be used for image conversion. To install it, run the appropriate command according to your distribution:

# bash

On Ubuntu/Debian:
sudo apt install webp

On Fedora:
sudo dnf install webp

On Arch Linux:
sudo pacman -S webp

On Slackware:
sudo slackpkg install libwebp

Converting Images to WebP

The cwebp command supports image conversion from PNG, JPEG, TIFF, and WebP formats. It is worth noting that animated PNG and WebP files are not supported.

Converting a JPG image to WebP:

# bash

cwebp -q 80 image-name.jpg -o image-name.webp 

Converting a PNG image to WebP:

# bash

cwebp -q 80 image-name.png -o image-name.webp 

In the examples above:

• -q 80 Defines the quality of the final WebP image, with values ranging from 0 to 100.
• -o Specifies the name of the WebP file to be generated after conversion.

Practical Example

In this example, we will convert two images: one in JPG format named illustration-01.jpg and another in PNG format named illustration-02.png, to WebP format. Listing the original files:

# bash

ls -lh

total 716K
-rw-r--r-- 1 rudi users 381K Feb 6 09:53 illustration-01.jpg
-rw-r--r-- 1 rudi users 329K Feb 6 10:00 illustration-02.png

We will use a quality of 60%, which will provide excellent compression without noticeable visual differences for many images.

Converting the image illustration-01.jpg to WebP:

# bash

cwebp -q 60 illustration-01.jpg -o illustration-01.webp

Saving file 'illustration-01.webp'
File: illustration-01.jpg
Dimension: 1400 x 800
Output: 136206 bytes Y-U-V-All-PSNR 37.51 36.24 36.67 37.13 dB
(0.97 bpp)
block count: intra4: 3897 (88.57%)
intra16: 503 (11.43%)
skipped: 1 (0.02%)
bytes used: header: 313 (0.2%)
mode-partition: 17761 (13.0%)
Residuals bytes |segment 1|segment 2|segment 3|segment 4| total
macroblocks: | 8%| 30%| 41%| 21%| 4400
quantizer: | 45 | 38 | 32 | 21 |
filter level: | 14 | 8 | 41 | 38 |

Checking the file size after conversion:

# bash

ls -lh illustration-01.*

-rw-r--r-- 1 rudi users 381K Feb 6 09:53 illustration-01.jpg
-rw-r--r-- 1 rudi users 134K Feb 6 10:28 illustration-01.webp

The compression reached approximately 65%, maintaining the visual quality of the image, as can be seen in the comparison between the images.

The conversion process for PNG images follows the same principle. Let's now convert the image illustration-02.png to WebP format:

# bash

cwebp -q 60 illustration-02.png -o illustration-02.webp

Saving file 'illustration-02.webp'
File: illustration-02.png
Dimension: 500 x 500
Output: 19842 bytes Y-U-V-All-PSNR 39.00 39.90 39.83 39.27 dB
(0.63 bpp)
block count: intra4: 730 (71.29%)
intra16: 294 (28.71%)
skipped: 8 (0.78%)
bytes used: header: 157 (0.8%)
mode-partition: 3267 (16.5%)
Residuals bytes |segment 1|segment 2|segment 3|segment 4| total
macroblocks: | 4%| 22%| 30%| 44%| 1024
quantizer: | 45 | 41 | 34 | 26 |
filter level: | 14 | 9 | 21 | 28 |

Checking the file size after conversion:

# bash

ls -lh illustration-02.*

-rw-r--r-- 1 rudi users 329K Feb 6 10:00 illustration-02.png
-rw-r--r-- 1 rudi users  20K Feb 6 10:56 illustration-02.webp

The compression reached an impressive 94%, maintaining excellent visual quality. Remember, the compression percentage varies depending on the image composition. Images with fewer colors, such as drawings or graphics, tend to be more compressed without losing much quality.

Support

The WebP format is natively supported by Google Chrome, Safari, Firefox, Edge, and Opera browsers. Additionally, many tools and libraries, including image editing software, already support WebP. However, there may still be some limitations on certain platforms or applications.

The webp package also includes a tool for decoding and viewing WebP images using OpenGL. To view a WebP image from the terminal, use the following command:

# bash

vwebp illustration-01.webp

Converting Multiple Images

Converting a single image using the command line, as seen in the previous examples, is relatively simple. However, when dealing with hundreds of images, the process can be more time-consuming. To optimize this, you can create a script that converts multiple images at once.

Script for batch conversion:

# bash

for file in *.{jpg,jpeg,png}; do cwebp -q 60 "$file" -o "${file%.*}.webp"; done

Run the above command inside the folder where the images to be converted are located. This script will convert all images with JPG, JPEG, and PNG extensions to WebP, keeping the original file names and only changing the extension to .webp. The original files will be preserved.

Command Explanation:

1. for file in *.{jpg,jpeg,png}:
   
   • Iterates over all files in the current directory with .jpg, .jpeg, and .png extensions.
2. cwebp -q 60 "$file":
   
   • Converts the current image $file to WebP with quality 60 (adjust the -q value as needed).
3. -o "${file%.*}.webp":
   
   • Defines the output file name. ${file%.*} removes the original file extension (e.g., photo.jpg becomes photo), and .webp is added at the end.
4. done
   
   • Ends the loop.

Converting Images from a Specific Directory

If you want to convert images from a specific directory, simply replace folder with the path to the desired directory:

# bash

for file in folder/*.{jpg,jpeg,png}; do cwebp -q 60 "$file" -o "${file%.*}.webp"; done

Deleting Original Images After Conversion

If you want to delete the original images after conversion, add && rm "$file" to the command:

# bash

for file in *.{jpg,jpeg,png}; do cwebp -q 60 "$file" -o "${file%.*}.webp" && rm "$file"; done

This will remove each original file after successful conversion.

Conclusion

The WebP format stands out as a modern and efficient solution for optimizing images on the web, combining high visual quality with significantly smaller file sizes. As we have seen in this article, converting images to WebP can be done quickly and practically using command-line tools like cwebp, available on most Linux distributions.

In addition to image conversion, the command offers a wide range of advanced options. You can change the compression mode, add transparency to images with backgrounds, resize, and crop images. To explore all the possibilities, consult the full manual by running the command man cwebp in the terminal.

Simple commands and automated scripts allow you to convert large quantities of images from formats like JPG, PNG, and TIFF to WebP, improving the performance of websites and applications, especially on mobile devices and slower connections.

If you haven't tried WebP yet, now is the ideal time to start. Take advantage of the techniques presented here and see how adopting this format can bring real benefits to your projects.

References

One of the sources for this article was the manual (man page) available on Slackware Linux.

• https://developers.google.com/speed/webp
• https://www.geeksforgeeks.org/converting-images-to-webp-open-source-format-in-linux/
• https://blog.ironlinux.com.br/converter-imagens-png-para-webp-linux/
• https://web.dev/articles/codelab-serve-images-webp?hl=pt-br

Site Notes

This is not my original language and I don't speak it very well. I used my little knowledge and translators tools to compose the text of this article. Sorry for possible spelling or grammatical errors, suggestions for corrections are appreciated and can be sent to the contact email in the footer of the site. My intention is to share some knowledge and I hope this translation is good enough.

Some of the content on this website, including text, images, graphics and other materials, may be generated or enhanced by artificial intelligence (AI) tools. For more details on the use of AI, please see our Term of Use.