Herramientas de imagen

Generador de imágenes de marcador de posición

Crea imágenes de marcador de posición en formato SVG y datos en línea con dimensiones, textos y colores personalizados.

Ejecutar herramienta

Este generador crea marcadores de posición en formato gráfico SVG y datos de imagen en línea para maquetas, prototipos y diseños web. Puedes definir el ancho y el alto en píxeles dentro de un rango admitido de 1 a 2000. Si dejas el campo de texto vacío, la imagen muestra automáticamente sus dimensiones numéricas separadas por un signo de multiplicación. También puedes personalizar el contenido del texto, el cual se procesa mediante escape de caracteres HTML antes de insertarse en el gráfico y en el texto alternativo. Para adaptar el marcador a la paleta visual de tu proyecto, tienes la opción de modificar el color de fondo y el color del texto mediante códigos de color, utilizando valores predeterminados neutros si no especificas ninguno. Tras pulsar el botón de generación, el panel muestra la representación gráfica resultante junto con el código listo para su integración.

Instrucciones

  1. Introduce el ancho deseado en píxeles entre 1 y 2000, o mantén el valor inicial de 400.
  2. Indica la altura requerida entre 1 y 2000, o conserva el valor inicial de 300.
  3. Escribe el texto que deseas mostrar en el centro de la imagen o déjalo en blanco para que figuren las dimensiones.
  4. Ajusta el código de color de fondo si necesitas un tono distinto al gris claro inicial (#cccccc).
  5. Especifica el código de color del texto si prefieres un tono diferente al gris oscuro (#333333).
  6. Ejecuta la herramienta para obtener el gráfico SVG y el bloque de datos de imagen en línea.

Ejemplos

  • Generar una miniatura de producto de 300 por 300 píxeles con fondo gris claro #e0e0e0, texto 'Producto' y tipografía en color #111111.
  • Crear un banner para maquetación web de 800 por 200 píxeles dejando el texto vacío para mostrar automáticamente la etiqueta 800x200 con fondo #dddddd.

Preguntas frecuentes

¿Qué ocurre si no introduzco ningún texto?

Cuando dejas el campo de texto en blanco, la imagen muestra automáticamente las dimensiones seleccionadas unidas por el signo de multiplicación.

¿Cuáles son los límites de tamaño para las dimensiones?

El ancho y el alto admiten valores comprendidos entre 1 y 2000 píxeles; cualquier valor fuera de ese intervalo se ajusta automáticamente a dichos límites.

¿En qué formato se entrega la imagen generada?

La herramienta genera un archivo gráfico SVG estructurado junto con una representación de datos de imagen en línea para su integración directa.

¿Cómo se procesan los caracteres especiales o etiquetas en el texto?

El texto introducido se procesa con escape de caracteres HTML antes de su inclusión en el SVG y en el texto alternativo.

Insertar esta herramienta

Añade esta herramienta funcional de SmartPlusLab a tu sitio web con el siguiente código.