Take your base image and use the overlay parameter (l in URLs) to add any further images. Set the required width and height (w and h in URLs) with the required crop mode, and add any further transformations, effects and texts.
Cloudinary allows taking any of your uploaded images and add them as overlays on any base image. The base image can be either from your uploaded images, remotely fetched images and more.
Here are four upload images we'd like to generate a collage from:
https://res.cloudinary.com/demo/image/upload/yellow_tulip.jpg
https://res.cloudinary.com/demo/image/upload/brown_sheep.jpg
https://res.cloudinary.com/demo/image/upload/horses.jpg
https://res.cloudinary.com/demo/image/upload/white_chicken.jpgNow we'll take these four images and place them one next to the other:
https://res.cloudinary.com/demo/image/upload/w_220,h_140,c_fill/l_brown_sheep,w_220,h_140,c_fill,x_220/l_horses,w_220,h_140,c_fill,y_140,x_-110/l_white_chicken,w_220,h_140,c_fill,y_70,x_110/yellow_tulip.jpgWe can add a fifth image (with the public ID 'butterfly') while rotating it a bit:
https://res.cloudinary.com/demo/image/upload/w_220,h_140,c_fill/l_brown_sheep,w_220,h_140,c_fill,x_220/l_horses,w_220,h_140,c_fill,y_140,x_-110/l_white_chicken,w_220,h_140,c_fill,y_70,x_110/l_butterfly.png,h_200,x_-10,a_10/yellow_tulip.jpgNow we'll round the corners of the image by setting the radius parameter (r in URLs) to the required pixels:
https://res.cloudinary.com/demo/image/upload/w_220,h_140,c_fill/l_brown_sheep,w_220,h_140,c_fill,x_220/l_horses,w_220,h_140,c_fill,y_140,x_-110/l_white_chicken,w_220,h_140,c_fill,y_70,x_110/l_butterfly.png,h_200,x_-10,a_10/r_20/yellow_tulip.jpgNow let's add a nice caption text:
https://res.cloudinary.com/demo/image/upload/w_220,h_140,c_fill/l_brown_sheep,w_220,h_140,c_fill,x_220/l_horses,w_220,h_140,c_fill,y_140,x_-110/l_white_chicken,w_220,h_140,c_fill,y_70,x_110/l_butterfly.png,h_200,x_-10,a_10/w_400,h_260,c_crop,r_20/l_text:Parisienne_35_bold:Memories from our trip,co_rgb:990C47,y_155/yellow_tulip.jpgFinally, we'll add a nice shadow effect by setting the effect parameter to shadow (e_shadow in URLs):
https://res.cloudinary.com/demo/image/upload/w_220,h_140,c_fill/l_brown_sheep,w_220,h_140,c_fill,x_220/l_horses,w_220,h_140,c_fill,y_140,x_-110/l_white_chicken,w_220,h_140,c_fill,y_70,x_110/l_butterfly.png,h_200,x_-10,a_10/w_400,h_260,c_crop,r_20/l_text:Parisienne_35_bold:Memories from our trip,co_rgb:990C47,y_155/e_shadow/yellow_tulip.jpgHere's another collage example:
https://res.cloudinary.com/demo/image/upload/w_100,h_100,c_fill/l_sample,w_100,h_100,c_fill,x_100/l_kitten,w_100,h_100,c_fill,y_100,x_-50/l_autumn_leaves,w_100,h_100,c_fill,y_50,x_50/r_max/e_shadow/fat_cat.jpg