Use images as text textures
Use images as text textures
Visual merchandising
Creative
Advanced

Instead of coloring your text with a solid color, fill it with an image and give it an interesting texture. How? Choose an image as your text texture, dynamically add a text overlay as explained in the Dynamic text overlay blog post, and set the flags parameter to cutter (fl_cutter in URLs).

Cloudinary allows you to dynamically generate an image out of any text string on the fly in the cloud. You can set the text's font color to any solid color. In addition, Cloudinary also supports generating a text while using an image to fill the font instead of a solid color.

Here's an example. This is an image we'd like to use for our text: Original image

We add the text by setting the overlay parameter (l in URLs) to text:<text_params>, where 'text_params' are the font style's parameters (e.g., font family, size, decoration and more). Setting the flags parameter to cutter (fl_cutter in URLs) will mask the image by the text string: Text texture


The textures aren't limited to uploaded images only - you can also fetch images from any remote HTTP URL. Here's a remote URL example (from Wikimedia Commons): ![Wikimedia commons image](http://upload.wikimedia.org/wikipedia/commons/thumb/0/0e/Drops_Imapct.JPG/1200px-Drops_Imapct.JPG "skip:true, with_url:true, thumb:https://res.cloudinary.com/demo/image/fetch/w_400/http://upload.wikimedia.org/wikipedia/commons/thumb/0/0e/Drops_Imapct.JPG/1200px-Drops_Imapct.JPG")

We can use the following to generate a text string out of this remote image. Note that for remotely fetched images, we first converted the image to PNG by setting the fetch_format to png (f_png in URLs). In addition, a nice shadow effect was added: Fetch + texture