Main image
Relative size overlays
Resize overlays to a given percentage of the main image, either related to width, height or both by setting the flags parameter to relative (fl_relative in URLs) while also setting the width and/or height parameters to the percentage value you need, represented by a decimal value (e.g., 0.4 for 40%).
100% width-related
Including text
Ruby:
cl_image_tag("black_bar.png")PHP:
cl_image_tag("black_bar.png")Python:
CloudinaryImage("black_bar.png").image()Node.js:
cloudinary.image("black_bar.png")Java:
cloudinary.url().imageTag("black_bar.png");JS:
cloudinary.imageTag('black_bar.png').toHtml();jQuery:
$.cloudinary.image("black_bar.png")
React:
<Image publicId="black_bar.png" > </Image>
Angular:
<cl-image public-id="black_bar.png" > </cl-image>
.Net:
cloudinary.Api.UrlImgUp.BuildImageTag("black_bar.png")Android:
MediaManager.get().url().generate("black_bar.png");iOS:
imageView.cldSetImage(cloudinary.createUrl().generate("black_bar.png")!, cloudinary: cloudinary)