Placeholder Image Generator

Generate SVG placeholder images with custom size and colors.

WidthHeightBackground

Text Color

Text (optional)

Preview

SVG Code

<svg xmlns="http://www.w3.org/2000/svg" width="640" height="480" viewBox="0 0 640 480">
  <rect width="100%" height="100%" fill="#CCCCCC" />
  <text x="50%" y="50%" dominant-baseline="middle" text-anchor="middle"
    font-family="Arial, Helvetica, sans-serif" font-size="60"
    fill="#666666">640 x 480</text>
</svg>

Data URL

data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22640%22%20height%3D%22480%22%20viewBox%3D%220%200%20640%20480%22%3E%0A%20%20%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20fill%3D%22%23CCCCCC%22%20%2F%3E%0A%20%20%3Ctext%20x%3D%2250%25%22%20y%3D%2250%25%22%20dominant-baseline%3D%22middle%22%20text-anchor%3D%22middle%22%0A%20%20%20%20font-family%3D%22Arial%2C%20Helvetica%2C%20sans-serif%22%20font-size%3D%2260%22%0A%20%20%20%20fill%3D%22%23666666%22%3E640%20x%20480%3C%2Ftext%3E%0A%3C%2Fsvg%3E