The Resize transformation is a fundamental tool for adjusting the dimensions of your images. Whether to ensure that images fit into specific layouts or to optimize loading performance.

Parameter structure

To apply the Resize transformation, the URL should be structured as follows:

/resize:[width]x[height],[optional arguments]/

/resize:800x600/ To resize to a width of 800 pixels and height of 600 pixels.

/resize:800x/ To resize while maintaining the original aspect ratio, adjusting only the width to 800 pixels.

/resize:x600/ To resize while maintaining the original aspect ratio, adjusting only the height to 600 pixels.

/resize:800x600,fit:fill/ To resize without respecting the aspect ratio, possibly creating a "stretched" effect on the image.

To apply the resizing, the URL should be formatted as follows:

https://img.voidr.co/my_project/resize:800x600/fetch/:url

Where value is the width and height in pixels, and optionally a fit setting.

Optional arguments

⚠️ This transformer accepts optional arguments, if not specified, the default fit is always cover

fit Defines how the image should be adjusted to the specified dimensions. The available values are:
- contain Resizes the image to fit within the specified dimensions, maintaining the aspect ratio.
- cover Resizes the image to completely fill the specified dimensions, which may crop parts of the image.
- fill Resizes and distorts the image to exactly fill the specified dimensions.
- inside Resizes the image to fit within the specified dimensions without distortion.
- outside Resizes the image to cover the specified dimensions while still maintaining the aspect ratio.

Usage examples

To resize an image to 800x600 pixels using the default cover fit, the URL would be:

https://img.voidr.co/my_project/resize:800x600/fetch/https://images.unsplash.com/photo-1561336313-0bd5e0b27ec8

To resize an image to 500x200 pixels using the fill fit, the URL would be:

https://img.voidr.co/my_project/resize:500x200,fit:fill/fetch/https://images.unsplash.com/photo-1561336313-0bd5e0b27ec8

To resize an image to 800x600 pixels using the contain fit, the URL would be:

https://img.voidr.co/my_project/resize:800x600,fit:contain/fetch/https://images.unsplash.com/photo-1561336313-0bd5e0b27ec8

To resize an image to 800x600 pixels using the outside fit, the URL would be:

https://img.voidr.co/my_project/resize:800x600,fit:outside/fetch/https://images.unsplash.com/photo-1561336313-0bd5e0b27ec8

To resize an image to 800x600 pixels using the inside fit, the URL would be:

https://img.voidr.co/my_project/resize:800x600,fit:inside/fetch/https://images.unsplash.com/photo-1561336313-0bd5e0b27ec8