Generador de Placeholder
- Indica ancho y alto, de 10 a 4000 píxeles.
- Elige los colores de fondo y de texto, y un texto opcional.
- Selecciona el patrón visual: sólido, damero o degradado.
- Elige el formato —PNG, JPEG, WebP o SVG— y descarga.
Ocupa el espacio de una imagen real mientras el contenido definitivo no existe. Eso permite evaluar el diseño con las proporciones correctas, sin esperar a la producción de las fotos.
Usar una imagen real bonita en el prototipo tiene el mismo problema que el texto real: desvía la evaluación hacia el contenido en lugar de la disposición. Un rectángulo gris con las dimensiones escritas mantiene el foco en la estructura.
Es también la forma de probar cómo se comporta el diseño con proporciones distintas: una imagen muy alta o muy ancha revela roturas que la foto ideal ocultaría.
El SVG es vectorial, así que el archivo es diminuto: normalmente unos cientos de bytes, sean cuales sean las dimensiones declaradas.
También escala sin perder nitidez, lo que ayuda cuando el mismo marcador aparece en tamaños distintos dentro del prototipo.
Para prototipar en herramientas de diseño que no importan SVG, o para probar el flujo real de imágenes, prefiere PNG o WebP.
El patrón de damero tiene un uso específico: hace evidente el estiramiento, porque los cuadrados dejan de ser cuadrados.
Una imagen de relleno publicada es el equivalente visual del Lorem ipsum olvidado en el texto. Se indexa, aparece al compartir y da impresión de sitio inacabado.
Peor todavía: si la imagen de relleno está en la etiqueta de compartición social, es la que aparece cuando alguien difunde el enlace.
La generación ocurre por completo en tu navegador; no se envía nada a servidores.
Preguntas frecuentes
SVG para el archivo más pequeño posible y escalado perfecto. PNG o WebP cuando la herramienta de destino no acepta SVG, o cuando quieres probar el flujo real de imágenes.
Para detectar distorsión. Si los cuadrados aparecen rectangulares en el diseño, la imagen se está estirando en una de las dimensiones.
No deberías. Una imagen de relleno publicada da impresión de sitio inacabado y, si está en la etiqueta de compartición, es la que aparece al difundir el enlace.
4000 píxeles en cada dimensión. Por encima, la generación en el navegador consumiría memoria sin utilidad práctica para prototipar.
No. Todo ocurre en tu navegador y no se transmite nada.