TR ToolRux

Placeholder Image Generator

Generate placeholder images with custom dimensions, colors, and text — choose from common presets and download as PNG.

Preview

Click "Generate" to see preview

Code Snippets

HTML
<img src="placeholder-600x400.png" width="600" height="400" alt="600 × 400" style="background:#CBD5E1;color:#475569;display:block;" />
CSS
background: #CBD5E1;
color: #475569;
width: 600px;
height: 400px;
font-size: 50px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;

Settings

#CBD5E1
#475569

Presets

Social Media

Ad Sizes

Screens

Related Tools

You might also find these useful

Image Resizer

Resize images to specific dimensions.

Color Palette Generator

Generate color palettes.

Lorem Ipsum Generator

Generate placeholder text.
📖 Learn More

Everything you need to know

Instant Placeholder Images

The Placeholder Image Generator creates custom placeholder images in your browser using the HTML5 Canvas API. Enter width, height, background color, text color, and optional text. The image is generated locally — no external service calls, no API keys, no rate limits.

Common Size Presets

Choose from presets organized by category: social media sizes (Facebook, Instagram, Twitter, YouTube), ad banner sizes (Leaderboard, Rectangle, Skyscraper), and device screen sizes (iPhone, iPad, HD, Full HD, 4K). Click a preset to instantly set the dimensions.

Customizable Appearance

Set any background color and text color using color pickers. By default, the placeholder shows the image dimensions as text. Override this with custom text and adjust the font size for your needs.

Code Snippets

The tool generates ready-to-use HTML <img> tags and CSS background snippets. Copy the code with one click and paste into your project for quick prototyping.

Related Tools

Compress real images with the Image Compressor, generate favicons with the Favicon Generator, or optimize SVGs with the SVG Optimizer.