Herramientas
Generador de imágenes de relleno
Generador de imágenes de relleno (placeholder)
Crea imágenes provisionales del tamaño y color que necesites para maquetas y prototipos.
Sobre esta herramienta
Mientras diseñas una web, una plantilla de correo o un prototipo, muchas veces aún no tienes las fotos definitivas. Una imagen de relleno ocupa su hueco con las medidas exactas y deja claro qué va ahí, para que la maqueta no se descuadre. También sirve para probar cómo se adapta un diseño a distintos formatos o para enseñar a un cliente las proporciones de un banner.
Escribe el ancho y el alto en píxeles o elige un tamaño rápido: HD, Cuadrado, Banner, Miniatura, Redes (1200×630) o Avatar. En «Colores» ajusta el fondo y el texto con el selector o escribiendo el código HEX. Por defecto, la imagen muestra sus medidas, pero puedes poner un texto personalizado. Elige PNG o SVG, pulsa «Descargar» o copia la data URL para pegarla directamente en tu HTML o CSS.
La imagen se dibuja en tu navegador y no se envía a ningún servidor, así que no depende de servicios externos que puedan caerse. El SVG es muy ligero y se escala sin perder nitidez; el PNG es más cómodo para herramientas que no aceptan vectores. El texto usa una fuente monoespaciada del sistema y va siempre centrado. No incluye fotos de muestra ni patrones: es un bloque de color con texto.
Preguntas frecuentes
¿Qué es una imagen placeholder?
Es una imagen provisional que reserva el espacio de la definitiva en un diseño o una web en construcción. Suele ser un bloque de color con sus medidas escritas, para que se vea de un vistazo qué tamaño hace falta.
¿Es mejor usar PNG o SVG para las imágenes de relleno?
El SVG pesa muy poco y se ve nítido a cualquier tamaño, así que es ideal para maquetas en HTML. El PNG es preferible si vas a usar la imagen en programas o plataformas que no admiten SVG.
¿Para qué sirve copiar la data URL?
La data URL contiene la imagen codificada dentro del propio texto. Puedes pegarla en el atributo src de una etiqueta <img> o en un background-image de CSS sin tener que guardar ni subir ningún archivo.
¿Qué tamaño uso para la imagen al compartir en redes?
El preajuste «Redes» crea una imagen de 1200×630 px, la medida habitual de las imágenes Open Graph que muestran Facebook, LinkedIn o WhatsApp al compartir un enlace.