Tools, Development, Design

Need place holder images for a new design? Placeholder is perfect for the job

When prototyping a new layout it's convenient to use placeholder images then it is to use the final images. You could make the placeholder images in an image editing program.

There is a far better way using a site called placeholder.com you can quickly get an image of any size you require by simply going to https://placeholder.com/ and placing your desired width and height after the address like: https://via.placeholder.com/350x150 which generates an image 350px wide by 150px tall you can then save the image and use it or use that path in an img src path like:</p>

<img src='https://via.placeholder.com/350x150'>

Which gives you this image:

You can also specify the colour of the background and text by passing them as extra parameters in the url call:

<img src="https://via.placeholder.com/350x150/226688/cfa" alt="" />

The first set of colours is the background the second is the text color.

A very useful service, one to bookmark.

David Carr

David Carr

For the past 12 years, I’ve been developing applications for the web using mostly PHP. I do this for a living and love what I do as every day there is something new and exciting to learn.

In my spare time, the web development community is a big part of my life. Whether managing online programming groups and blogs or attending a conference, I find keeping involved helps me stay up to date. This is also my chance to give back to the community that helped me get started, a place I am proud to be apart of.

Besides programming I love spending time with friends and family and can often be found together going out catching the latest movie, staying in playing games on the sofa or planning a trip to someplace I’ve never been before.