Placeholder Image Sizes: The Complete Reference Guide

Why Placeholder Image Dimensions Matter

Using the correct placeholder image size does two things: it keeps your design accurate during development (so when you replace the placeholder with a real image, nothing jumps or resizes), and it helps with Core Web Vitals. Browsers use the width and height attributes to reserve space before the image loads. If the placeholder has the same dimensions as the final image, you avoid Cumulative Layout Shift (CLS), which Google uses in ranking.

Always set explicit width and height on your <img> tags and use a placeholder URL that matches those dimensions. For example, a 600×400 card should use https://placeholderimage.co/600x400 so the layout is correct from the first paint.

Icon and Favicon Sizes

Icons and favicons are small and usually square. Common placeholder sizes: 16×16 (favicon), 32×32 (small icon), 64×64 (app icon small). Use these when building navigation, app launchers, or PWA icons so the layout doesn’t collapse before the asset loads.

Avatar and Profile Picture Sizes

Avatar placeholders are almost always square. Use 100×100 for comment sections and small lists, 150×150 for profile thumbnails, 200×200 for profile pages, and 400×400 for high-resolution headers or social cards. A person placeholder can use custom text: https://placeholderimage.co/200x200/1c1c2e/a3a3a3?text=User.

Product and E-commerce Sizes

Product images are usually square for grids and detail pages. 300×300 and 400×400 are standard for product grids. Shopify recommends up to 2048×2048 for full-size images; for placeholders, 800×800 or 1024×1024 is enough. WooCommerce often uses 800×800. Using the same aspect ratio (e.g. 1:1) for placeholders and final images keeps your layout stable.

Web and Blog Sizes

For general web and blog content: 300×200 (3:2 card), 400×300 (4:3 content block), 600×400 (blog cover, very common), 800×600 (article banner). The 600×400 placeholder is the default choice for many card-based layouts and blog thumbnails.

Social and Open Graph Sizes

Social platforms expect specific dimensions for link previews and feed images. 1200×630 is the standard for Open Graph and Facebook shared links. Instagram feed posts use 1080×1080 (square); Stories and Reels use 1080×1920 (9:16). Use these sizes for placeholders when you’re building share previews or social embeds so the crop and aspect ratio match the final asset.

Video Thumbnail and Hero Sizes (16:9)

The 16:9 aspect ratio is standard for video and many hero sections. Common sizes: 640×360 (small), 1280×720 (HD), 1920×1080 (Full HD). Use these for video thumbnail placeholders, hero banners, and full-width backgrounds. Example: https://placeholderimage.co/1280x720/18181b/a1a1aa?text=Video+Thumbnail.

Ad Banner Sizes (IAB)

The IAB defines standard ad dimensions. Common placeholder sizes: 728×90 (Leaderboard), 300×250 (Medium Rectangle), 160×600 (Wide Skyscraper), 320×50 (Mobile Banner). Use these exact dimensions when building ad slots so your placeholder matches the final creative size.

Complete Size Reference by Category

Below are all standard sizes from the PlaceholderImage.co size guide. Each URL is ready to use; click or copy to use in your project.