Next Cloudinary

High-performance image and video delivery and uploading at scale in Next.js powered by Cloudinary.

  • Automatically optimize images and videos and deliver in modern formats
  • Remove backgrounds from images
  • Dynamically add image and text overlays to images and videos
  • AI-based cropping and resizing
  • Transform images and videos using color and effects
  • Generate Open Graph Social Media cards on the fly
  • Drop-in Upload Widget
  • ...all at scale with Cloudinary
  • Original image of woman with headphones
  • Image of woman with headphones transformed with Cloudinary
<CldImage  width="987"  height="987"  src="images/woman-headphones"  sizes="50vw"  crop="thumb"  gravity="faces"  removeBackground  tint="40:253f8c"  underlay="images/city-skyline"  overlays={[  {  position: {  gravity: 'north',  y: 60  },  text: {  color: 'rgb:52a4ff80',  fontFamily: 'Source Sans Pro',  fontSize: 320,  fontWeight: 'black',  text: 'MUSIC',  letterSpacing: -10,  lineSpacing: -100,  stroke: true,  border: '20px_solid_rgb:2d0eff99',  }  },  {  position: {  gravity: 'south',  y: 60  },  text: {  color: 'rgb:52a4ff80',  fontFamily: 'Source Sans Pro',  fontSize: 320,  fontWeight: 'black',  text: 'IS LIFE',  letterSpacing: -10,  lineSpacing: -100,  stroke: true,  border: '20px_solid_rgb:2d0eff99',  }  }  ]}  alt="Image of woman with headphones transformed with Cloudinary" />