How to change the pixel size of an image?

Image API
1

I have some high resolution images. But they are very big to be loaded as it is on mobile apps. I want to change the pixel size of the image and bring it down to less than 640px in width. How can I do this with ImageKit?

2

I think by pixel size you mean you want to resize the image, or maybe crop the image for your requirement.

ImageKit offers real-time resizing and cropping parameters for images. These images can be in the ImageKit Media Library or present on your server or cloud storage like S3, Azure, etc., that is connected to ImageKit.

You need to add the height or width transformation parameters in the URL and you will get your image resized in real time.

For example, to resize the image to width 310px, we add tr=w-310 transformation parameter to the URL

https://ik.imagekit.io/ikmedia/example_image.jpg?tr=w-310

In your specific case, if you want to keep the size always smaller than 640px, you can use the c-at_max transformation along with both height and width set to 640px. This will limit the max size of the image under 640x640 while maintaining the aspect ratio and without any cropping.

https://ik.imagekit.io/ikmedia/example_image.jpg?tr=w-640,h-640,c-at_max

ImageKit uses a CDN for fast loading time, and you can directly use this URL on your website or app for your end users.

Cropping of image when changing image size

By default, when changing the image size, if you specify both height and width, cropping will happen. But, there are other crop modes as well that can help prevent cropping by either modifying the output size requested or by adding some padding around the image. You can read about the different crop options and their examples here.

Manual Resize

In ImageKit, you can also resize the image manually if needed using the browser-based image editor in ImageKit. For this, upload the image to the ImageKit Media Library, which is a built-in DAM solution, and use the image editor to resize the image. You can download the image or save it back to the media library.

If you have an entire folder of images in the Media Library, you have an option of changing the image size when downloading the entire folder as a ZIP. You need to specify the URL resizing parameters like we did in the example above, and that resize or crop will get applied to all images.

See the screenshot below for this option.