Generador de imágenes de marcador
Elige dimensiones, colores y una etiqueta. Obtén una imagen de marcador instantánea para maquetas, banners o pruebas de desarrollo. Sin cuenta, sin marca de agua.
Cómo funciona
La vista previa no es una simulación de tu imagen, es la imagen: un elemento canvas dimensionado
a tus píxeles exactos, rellenado y rotulado con la API de dibujo 2D, y luego codificado
directamente a PNG, JPG o WebP con canvas.toBlob. El tamaño de fuente de la etiqueta
se escala según el lado más corto (aproximadamente un octavo de él, con un mínimo de 12px), así
el texto se mantiene proporcionado tanto si generas una miniatura de 64px como un banner de
4000px. En modo foto, la imagen subida se ajusta tipo "cover", escalada para llenar y recortada
desde el centro exactamente como object-fit: cover en CSS, y la etiqueta recibe un
fondo oscuro translúcido para seguir siendo legible sobre una imagen con mucho detalle.
El redibujado es síncrono en cada pulsación; solo la codificación más pesada del blob se retrasa brevemente, por eso el tamaño mostrado va un instante por detrás de la vista previa. Algo a tener en cuenta: los marcadores de color plano se comprimen de forma absurdamente eficiente. Un PNG sólido de 4000×4000 suele pesar menos de 40 KB, porque DEFLATE aplana filas idénticas casi a la nada. Es genial para maquetas rápidas, pero engañoso si estás probando el rendimiento de carga, ya que una foto real de ese tamaño pesaría cien veces más. Para un peso honesto, usa el modo de fondo con foto, o combina esto con el generador de archivos de prueba para ajustar el tamaño en bytes a algo realista.
Dibujar, codificar y descargar ocurre todo dentro de esta pestaña, incluida cualquier foto que sueltes, que se lee mediante una URL de objeto y nunca sale de la memoria. Abre las herramientas de desarrollador y observa la pestaña Red mientras generas: ninguna petición transporta tu imagen.