The placeholder image
that doesn’t look
like a placeholder.

Craft a URL, drop it in an img tag, and you’re done. Any size. Any color. Gradients. Text. No signup, no API key, no rate limits. Free forever.

<img src="https://placeimg.dev/400x300/4F46E5" />

The Problem

You've been looking at this for years.

Generic gray placeholder

Every developer has the same muscle memory: paste a placeholder URL, gray rectangle appears, prototype is "done."

Except it doesn't look done. It looks unfinished. Your screenshots look like wireframes. Your demos look like they need "more work." Your tutorial readers copy a URL and wonder why their images look wrong.

You know exactly what size you need. You know your brand color. You might even know what text you want on it. There's just been no easy way to get all of that in a URL.

API

Three seconds. One URL.

  • 400×400 square
  • 400×300 rectangle
  • custom background color (hex)
  • centered text
  • custom color & text
  • gradient background

Live Examples

Click to copy

These are real placeimg.dev URLs — not screenshots. Click any to copy.

Blue rectangle
/400x225/4F46E5?text=placeimgBlue rectangle
Wide yellow
/600x338/FFB300?text=Wide+YellowWide yellow
Gradient
/500x281/00B894?gradient=00B894,00BFFF&text=GradientGradient
Dark (white text)
/400x225/222222?text=Dark&textColor=ffffffDark (white text)
Red
/400x225/FF5733?text=RedRed
Gradient 2
/350x197?gradient=FF5733,4F46E5&text=GradientGradient 2

Why placeimg

Everything you actually need from a placeholder.

SVG. Not a blurry PNG.

Infinitely scalable. Crisp on retina. Tiny file size. The same URL looks perfect at 1x and 4x — so your Figma handoffs, screenshots, and production mockups all look sharp.

Permanent URLs. Commit them like code.

Every placeimg.dev URL is cached forever. The URL you wrote six months ago still works. The URL in your tutorial still loads for your readers. No broken images. No re-uploads.

No account. No API key. No rate limit.

Copy the URL. Paste it. It works. That's the entire setup. We don't want your email. We don't want your credit card. We don't want anything except for your placeholder images to look good.

Built for

Wherever you need an image that isn't there yet.

Prototyping

Building a layout and the images don't exist yet? Pick your color, pick your size, get a URL. Your prototype looks real. Your screenshots look designed.

Tutorials & Docs

Writing a tutorial? Every placeimg.dev URL your readers copy produces the same image you see. Deterministic. Permanent. No hosting required.

Design Systems & Storybook

Need consistent placeholder content across 40 component stories? Generate a color-matched set, commit the URLs. Done.

Packages

There's also a React component.

If you'd rather import than copy-paste, react-svg-placeholder-ts is on npm. Drop-in replacement for any placeholder in your React or Next.js project.

FAQ

Questions developers actually ask

How do I add a placeholder image to my project?
Use a plain img tag with a placeimg.dev URL. For example: <img src="https://placeimg.dev/400x300" alt="placeholder" />. No installation or API key required.
Is placeimg.dev free to use?
Yes, completely free with no account, no API key, and no rate limits. Just craft a URL and use it anywhere.
What image sizes does placeimg.dev support?
Any size from 1×1px up to 2000×2000px. Use /WIDTHxHEIGHT for rectangles (e.g. /1200x630) or /SIZE for squares (e.g. /400).
Can I use placeimg.dev in a React or Next.js project?
Yes. Use a plain img tag: <img src="https://placeimg.dev/400x300/4F46E5" width={400} height={300} alt="placeholder" />. A React component is also available on npm: react-svg-placeholder-ts.
Does placeimg.dev work without JavaScript?
Yes. Images are served as static SVG responses directly from the URL — no JavaScript needed on the page or server.
Is this really free? What’s the catch?
No catch. No freemium bait. No ‘free until it gets popular.’ SVG generation is trivially cheap to serve, and placeholder images should be free. If that ever changes, we’ll give plenty of warning and the URLs will keep working regardless.

Your next placeholder image is one URL away.

No account. No setup. Just a URL that works.

Generate My First Image →

Or jump straight to the URL: https://placeimg.dev/400x300/4F46E5