A really convenient and clever way to use placeholder images when creating for the web. I love this tool and shutter when I think of the time I have wasted creating placeholders by hand with photoshop.

All you need to do is enter placehold’s URL into your image tag: http://placehold.it followed by a slash and the dimensions (“x” in between width and height) of the placeholder image you need like this: /300×150. If the placeholder image you need is square you only need to enter one value: /300 = 300×300. The size of the image is automatically added on the image as text. You can also specify colors by again adding a slash after, then the dimensions followed by the hex value, a slash separates the fill and text color. Custom text can be added via query string at the end of the whole thing like this: &text=save+time. The default format is .gif, you can also specify the following formats if needed: .jpg, .jpeg, .png

Examples:

2 Dimensions:

<img src="http://placehold.it/500x100" alt="http://placehold.it" />

Squared:

<img src="http://placehold.it/250" alt="http://placehold.it" />

With color:

<img src="http://placehold.it/200/E8117F/FFFFFF" alt="http://placehold.it" />

With color and text:

<img src="http://placehold.it/200x500/69AECE/FFFFFF&text=save+time" alt="http://placehold.it" />

Source:

http://placehold.it/

Blog Placeholder Tools