Adding Text to an Image
You can add text on top of your image with text-based overlays.
Example
<CldImage
width="1335"
height="891"
src="images/sneakers"
sizes="100vw"
overlays={[{
width: 2670 - 20,
crop: 'fit',
position: {
x: 140,
y: 140,
angle: -20,
gravity: 'south_east',
},
text: {
color: 'blueviolet',
fontFamily: 'Source Sans Pro',
fontSize: 160,
fontWeight: 'bold',
textDecoration: 'underline',
letterSpacing: 14,
text: 'Cool Beans'
}
}]}
alt="Sneakers with Cool Beans"
/>