🏞️ Generador de Imagen de Marcador
Crea imágenes de marcador personalizadas con cualquier ancho y alto — elige el color de fondo, el color del texto y la etiqueta, luego descarga como PNG, JPEG o WebP directamente en tu navegador.
Acerca de
Esta herramienta utiliza la Canvas API del navegador para renderizar un rectángulo de color sólido con las dimensiones en píxeles que indiques, y superpone una etiqueta de texto centrada — por defecto muestra el tamaño de la imagen, por ejemplo 800×600. Puedes elegir cualquier color de fondo y de texto mediante selectores, escribir una etiqueta personalizada y seleccionar PNG, JPEG o WebP como formato de salida. El resultado se puede guardar como archivo o copiar como URI de datos Base64 para insertarlo directamente en HTML o CSS. Como todo se ejecuta en el lado del cliente, tus datos no salen del navegador y no se necesita cuenta ni servidor.
Cómo usar
- Introduce el ancho y el alto deseados en píxeles (hasta 4000 cada uno).
- Elige un color de fondo y un color de texto usando los selectores de color.
- Escribe una etiqueta personalizada, o déjala vacía para mostrar las dimensiones automáticamente.
- Selecciona el formato de salida — PNG, JPEG o WebP — y comprueba la vista previa en vivo.
- Haz clic en Descargar para guardar el archivo de imagen, o copia el URI de datos Base64 para incrustarlo directamente en código.
Preguntas frecuentes
- ¿Qué es una imagen de marcador?
- Una imagen de marcador es un gráfico temporal que se usa durante el desarrollo web o de aplicaciones para reservar espacio en el diseño antes de que la imagen real esté lista — habitual en wireframes, prototipos y plantillas HTML.
- ¿Hay un tamaño máximo de imagen?
- El generador admite hasta 4000×4000 píxeles. Superado ese límite, la memoria del canvas del navegador puede causar errores. Para la mayoría de los usos de desarrollo, 4000 px por lado es más que suficiente.
- ¿Qué es un URI de datos Base64 y cuándo debo usarlo?
- Un URI de datos Base64 codifica la imagen como una cadena de texto que puedes pegar directamente en el atributo src de un img o en el valor background-image de CSS, sin necesidad de un archivo de imagen aparte. Ideal para imágenes pequeñas en prototipos o correos.
- ¿Qué formato de salida debo elegir — PNG, JPEG o WebP?
- Elige PNG para calidad sin pérdida y compatibilidad con transparencia, JPEG para archivos más pequeños cuando la transparencia no es necesaria, y WebP para el mejor equilibrio entre tamaño y calidad en navegadores modernos.
- ¿Esta herramienta sube mis datos a un servidor?
- No. La imagen se genera completamente en tu navegador usando la Canvas API y nunca se transmite a ningún servidor. Sin inicio de sesión, sin carga, sin recopilación de datos.