What size should placeholder images be?

The exact dimensions of the slot they will fill in the final design. A placeholder at the wrong aspect ratio hides layout bugs that only surface when real content arrives.

Can I use these placeholders in a client prototype?

Yes. There is no watermark and no attribution requirement, so they are fine for prototypes, design files and client presentations.

Is there a maximum image size?

4000×4000 pixels, which is well beyond any mobile layout slot. Generation happens in your browser, so very large sizes are limited by your device rather than a server.

floow.design

Placeholder Image Generator

Build placeholder images at any size, with your own colours, label and format.

Generate freeSign up to download the imageNo usage limits

Aspect ratio

Width (px)Height (px)LabelLeave blank to show the dimensions.Background

Text

Set dimensions, colours and a label, and get a placeholder image sized exactly for the slot you are filling.

Better than a grey box: a placeholder carrying its own dimensions tells you at a glance whether the layout is using the size you intended.

Why a labelled placeholder beats a grey box

A plain rectangle tells you nothing when a layout misbehaves. A placeholder that prints its own dimensions makes an incorrect slot obvious immediately — you can see that a 400×300 image is being rendered into a square container without opening dev tools. The diagonals do the same job for aspect ratio: any distortion shows up as asymmetric crossing lines.

Placeholders at the real aspect ratio

The most common layout bug found late is an image slot that was designed square and populated with 16:9 photography. Using placeholders at the true aspect ratio of the eventual content surfaces that mismatch while it is still cheap to fix.

Test with awkward content

Real apps get portrait photos where landscape was expected, and images that fail to load entirely. Generate a few placeholders at hostile ratios and check your layout survives them, rather than designing only against the ideal case.

How to use the placeholder image generator

Pick an aspect ratio preset, or set a custom width and height.
Leave the label blank to print the dimensions on the image itself — usually more useful than a caption.
Match the colours to your app's surfaces so the placeholder does not visually shout over the layout.
Generate a couple at hostile ratios too, to check the layout survives unexpected content.
Download the PNG and drop it into your design or prototype.

Use it with

Aspect Ratio Calculator — Work out the missing width or height for any ratio, with the common phone and store ratios one click away.
Phone Mockup Generator — Drop a screenshot into a realistic iPhone or Android frame and export it ready to post.
WebP Converter — Convert PNG and JPEG to WebP, or WebP back out, with a quality slider and a live size comparison.

Frequently asked questions

What size should placeholder images be?: The exact dimensions of the slot they will fill in the final design. A placeholder at the wrong aspect ratio hides layout bugs that only surface when real content arrives.
Can I use these placeholders in a client prototype?: Yes. There is no watermark and no attribution requirement, so they are fine for prototypes, design files and client presentations.
Is there a maximum image size?: 4000×4000 pixels, which is well beyond any mobile layout slot. Generation happens in your browser, so very large sizes are limited by your device rather than a server.