Demo | ImageResizer.io

If you add a fit=contain parameter, the image will not be cropped but instead will be resized so that its dimensions fit within your specified dimensions whilst maintaining its aspect ratio.

Examples:

https://im.ages.io/NKrigl4?width=300&height=300

https://im.ages.io/NKrigl4?size=300x300

https://im.ages.io/NKrigl4?size=300

https://im.ages.io/NKrigl4?width=100&height=300

https://im.ages.io/NKrigl4?size=100x300

https://im.ages.io/NKrigl4?w=300&h=300

https://im.ages.io/NKrigl4?s=300x300

https://im.ages.io/NKrigl4?s=300

https://im.ages.io/NKrigl4?w=100&h=300

https://im.ages.io/NKrigl4?s=100x300

https://im.ages.io/NKrigl4-w300-h300

https://im.ages.io/NKrigl4-s300x300

https://im.ages.io/NKrigl4-s300

https://im.ages.io/NKrigl4-w100-h300

https://im.ages.io/NKrigl4-s100x300

https://im.ages.io/NKrigl4?size=300x300

https://im.ages.io/NKrigl4?s=300x300

https://im.ages.io/NKrigl4-s300

Elliptical Mask

Simply add an ellipse URL parameter to cut out an oval shape.

Combine it with a square size for a great looking circlular cut out.

For a transparent background, add a format parameter and set it to png.

Examples:

https://im.ages.io/NKrigl4?height=300&ellipse

https://im.ages.io/NKrigl4?size=300&ellipse

https://im.ages.io/NKrigl4?size=300&ellipse&format=png

https://im.ages.io/NKrigl4?h=300&e

https://im.ages.io/NKrigl4?s=300&e

https://im.ages.io/NKrigl4?s=300&e&f=png

https://im.ages.io/NKrigl4-h300-e

https://im.ages.io/NKrigl4-s300-e

https://im.ages.io/NKrigl4-s300-e.png

https://im.ages.io/NKrigl4?height=300&ellipse

https://im.ages.io/NKrigl4?h=300&e

https://im.ages.io/NKrigl4-h300-e

Blur

An easy way to accomplish cross-browser image blur, add a blur parameter with a value indicating the intensity of the image blur.

Examples:

https://im.ages.io/NKrigl4?height=300&blur=5

https://im.ages.io/NKrigl4?height=300&blur=10

https://im.ages.io/NKrigl4?height=300&blur=20

https://im.ages.io/NKrigl4?h=300&b=5

https://im.ages.io/NKrigl4?h=300&b=10

https://im.ages.io/NKrigl4?h=300&b=20

https://im.ages.io/NKrigl4-h300-b5

https://im.ages.io/NKrigl4-h300-b10

https://im.ages.io/NKrigl4-h300-b20

https://im.ages.io/NKrigl4?height=300&blur=10

https://im.ages.io/NKrigl4?h=300&b=10

https://im.ages.io/NKrigl4-h300-b10

Grayscale

For a classic and elegant look, just add a grayscale URL parameter.

Combine with blur for a great looking background image effect.

Examples:

https://im.ages.io/NKrigl4?height=300&grayscale

https://im.ages.io/NKrigl4?height=300&grayscale&blur=10

https://im.ages.io/NKrigl4?size=300&grayscale&ellipse

https://im.ages.io/NKrigl4?h=300&g

https://im.ages.io/NKrigl4?h=300&g&b=10

https://im.ages.io/NKrigl4?s=300&g&e

https://im.ages.io/NKrigl4-h300-g

https://im.ages.io/NKrigl4-h300-g-b10

https://im.ages.io/NKrigl4-s300-g-b

https://im.ages.io/NKrigl4?height=300&grayscale

https://im.ages.io/NKrigl4?h=300&g

https://im.ages.io/NKrigl4-h300-g

Other image manipulations

Standard URLs Short URLs Clean URLs

Change image format

JPEG, PNG or WebP

https://im.ages.io/NKrigl4?height=300&format=jpeg

https://im.ages.io/NKrigl4?height=300&format=png

https://im.ages.io/NKrigl4?height=300&format=webp

https://im.ages.io/NKrigl4?h=300&f=jpg

https://im.ages.io/NKrigl4?h=300&f=png

https://im.ages.io/NKrigl4?h=300&f=webp

https://im.ages.io/NKrigl4-h300.jpg

https://im.ages.io/NKrigl4-h300.png

https://im.ages.io/NKrigl4-h300.webp

JPEG

PNG

Change image quality

JPEG & WebP only

https://im.ages.io/NKrigl4?size=300&format=jpeg&quality=100

https://im.ages.io/NKrigl4?size=300&format=jpeg&quality=50

https://im.ages.io/NKrigl4?s=300&f=jpg&q=100

https://im.ages.io/NKrigl4?s=300&f=jpg&q=50

https://im.ages.io/NKrigl4-s300-q100.jpg

https://im.ages.io/NKrigl4-s300-q50.jpg

Quality: 100%

Quality: 50%

Rotate image

90, 180 or 270 degrees

https://im.ages.io/NKrigl4?size=300&rotate=90

https://im.ages.io/NKrigl4?size=300&rotate=180

https://im.ages.io/NKrigl4?size=300&rotate=270

https://im.ages.io/NKrigl4?s=300&r=90

https://im.ages.io/NKrigl4?s=300&r=180

https://im.ages.io/NKrigl4?s=300&r=270

https://im.ages.io/NKrigl4-s300-r90.jpg

https://im.ages.io/NKrigl4-s300-r180.jpg

https://im.ages.io/NKrigl4-s300-r270.jpg

Rotate: 90°

Rotate: 180°

Trimming empty space around images

If your image contains any empty space around its edges, Image Resizer can auto-detect this and remove it from the image.

Simply add a format parameter to your image URL.

If the above example image contains empty space around its edges, you can see border trimming in action by clicking on the following link:

https://im.ages.io/NKrigl4?size=300&fit=contain&trim

https://im.ages.io/NKrigl4?s=300&contain&trim

https://im.ages.io/NKrigl4-s300-contain-trim.jpg

SEO Optimized Images

Increase your Search Engine Optimization by including custom keywords at the end of the image URL.

If your keywords conflict with the transform parameters above when in "clean URL" mode, you will need to switch off clean URLs in your settings.

Adding keywords to your image URLs will increase your ranking in search engines such as Google when users search for those keywords.