Quick and simple image placeholder

Generate awesome colorful placeholders for your web sites and projects.

Example Image Placeholders

Just some examples of our placeholding images. plchldr.co generates custom placeholder images on the fly, like these examples:

Example Image Placeholders 5
Example Image Placeholders 6
Example Image Placeholders 7
Example Image Placeholders 8
Example Image Placeholders 9
Example Image Placeholders 10

Using Image Placeholders

Use PLCHLDR.CO directly in your project.

Basic Usage Placeholder Images

This is the most basic way to use placeholders. Copy the code and modify the size to your liking.

Random Image Generator

Custom Background Color Placeholder Images

You can use custom background colors with our placeholders, Check out the example code below to learn how to do this.

Lorem Image Generator

Custom Text Color Placeholder Images

You can change the color of the placeholder text easily, Check out the example code below to learn how to do this.

Dynamic Dummy Image Generator

Custom Text Placeholder Images

Using custom text in your placeholders is easy as pie! Check out the example code below to learn how to do this.

Placeholder Image Generator

How to use dummy images?

plchldr.co is a server-side image rendering tool that allows web developers and designers alike to dynamically create images to be used as placeholders in a project. The only required parameter is a number for the image's width. Of course, you also have the ability to supply more parameters, such as height, colors, text and more!

A2 Hosting

Just specify the image size after our url and you’ll get a placeholder image. So the image URL should look this: https://plchldr.co/i/336x280

You can use the images in your HTML or CSS, like this:
<a href="https://plchldr.co/"><img src="https://plchldr.co/i/336x280" alt="plchldr.co"></a>

Specify the width first, then height. Height is optional: if no height is specified, your placeholder image will be a square. https://plchldr.co/i/336 And generates a 336x336 pixel square dummy image.

You can specify text for your image by using a query string at the very end of the URL. https://plchldr.co/i/728x90?text=webdesign

728x90 dummy image

Text is optional. The default is the image dimensions in pixels. You can use A-Z characters, upper or lowercase, numbers, and most symbols.

By default, text is white and the background random color. Colors are represented as hex codes after the dummy image dimensions. For example, #FF0000 is red. Colors must follow the dimensions. The first color is always the background color, and the second color is the text color.

https://plchldr.co/i/125x125?bg=000000&fc=ffffff&text=apple.com
https://plchldr.co/i/125x125?bg=f1dea1&fc=6040fb&text=godady.com
https://plchldr.co/i/125x125?bg=252f3f&fc=f29800&text=amazon.com
https://plchldr.co/i/125x125?bg=f1f1f1&fc=e200c2&text=lyft.com
https://plchldr.co/i/125x125?bg=5dd851&fc=000000&text=spotify.com

apple dummy imagegodady dummy imageamazon dummy imagelyft dummy image

Dynamic Dummy Image Generator

Placeholder images for your project in progress. Custom URLs generate placeholder pictures in various sizes with categories and effects. When designing websites, you may not have the images you need at first. But you already know the sizes and inserting some placeholders can help you better seeing the layout. Don’t waste your time making dummy images for your mockup or wireframe. plchldr.co is a little tool that generates images with an URL. Choose the size, the colors, even the text. Placeholder Images for every case. Webdesign or Print. Just put a custom url in your html and you receive a proper placeholder picture. Free online placeholder image generator tool by plchldr.co to create perfect images. This placeholder image generator offers a lot of options, including width and height, ratios, background and foreground color, and our favorite—common preset screen and ad sizes.