How to resize and compress images

Squoosh is a simple image editing program which lets you resize image dimensions and compress image files.

1. Open your image in Squoosh

You can drop, paste or choose your image with the file selector. 

Image editing is processed locally in your browser, so the image is not uploaded to Squoosh servers and there is no privacy risk.

2. Using the editor screen

The editor screen has all the tools you'll need to resize, compress and save your edited image.

Zoom

The zoom control is on the bottom of the screen. It is set to 100% by default when you open the editor, but you may find it helpful to zoom out so you can see the whole image.

Editing panel

The panel on the right is where you will find all the editing tools you'll need.

Before and after slider

The slider in the centre of the screen shows the original image on the left and the edited image on the right. You can click and drag the slider to compare the original image with the edited version.

3. Resize the image

Enter width and height

Enter the new width and height. For example, a landscape body content image should be 818 x 496. You may also need to change the aspect ratio to enter the correct dimensions.

Image ratios, sizes and component use

Change the aspect ratio

To change the aspect ratio to fit the correct image dimensions:

• untick 'maintain aspect ratio'

• change the 'fit method' to 'contain'.

If the image dimensions don't match the aspect ratio of original image, you'll need to untick the 'maintain aspect ratio' setting and change the 'fit method' to 'contain'. This will let you enter the correct image dimensions, and it will automatically crop the image to fit.

4. Compress the file size

By default, Squoosh will save the edited image at 75% of its original quality. This is usually a good level of compression to maintain the visual quality of the image and reduce the file size to less than 100 kb. 

You can lower the quality level if the file size is still more than 100 kb or increase the quality if the image loses clarity.

When compressing the file size, make sure:

• the file size is less than 100 kb

• the image looks good with no visible pixelation.

5. Save the edited image

Click the save icon in the bottom right corner to save your edited image. 

The default compression method is MozJPEG, this will save your image with a jpg file extension. The jpg format is usually the best file type for web images as the file size can be compressed without losing image quality. 

When you save your image, make sure you follow the correct naming conventions. 

Other tips

• If the original image dimensions are smaller than the size you need, it's best to avoid enlarging the image. 

• If the image requires specific cropping due to a non-centred focus point, it's best to use a different tool to crop the image first.