> ## Documentation Index
> Fetch the complete documentation index at: https://docs.xquiz.com.br/llms.txt
> Use this file to discover all available pages before exploring further.

# Imagen

> Elemento para exibir imagens

<img style={{ borderRadius: "0.5rem" }} src="https://mintcdn.com/xquiz-12076fbf/DabTafNhExNz5i1G/images/imagem.png?fit=max&auto=format&n=DabTafNhExNz5i1G&q=85&s=c565da7f44dd88562746563bd6ba72a3" width="1700" height="900" data-path="images/imagem.png" />

El elemento Imagen se usa para mostrar una imagen única destacada en tu página. Es ideal para complementar visualmente el contenido, ilustrar información, mostrar un producto, una captura de pantalla o cualquier otro recurso gráfico.

## Para qué sirve

* Ilustrar contenido con una imagen impactante.

* Mostrar un producto, captura de pantalla o resultado.

* Agregar un toque visual a páginas más textuales.

* Apoyar títulos y llamadas con impacto.

## Lo que puedes configurar

### Imagen

Sube una imagen directamente desde tu dispositivo.

### Tamaño

Define el tamaño de visualización de la imagen en píxeles.

### Animación

Elige el tipo de entrada (por ejemplo, Aparecer).

### Imagen Enlazable

Activa esta opción para transformar tu imagen en un elemento clickeable que puede dirigir al usuario a otras páginas o funciones de tu flujo.

<video muted className="aspect-auto w-full rounded-xl" controls src="https://mintcdn.com/xquiz-12076fbf/DabTafNhExNz5i1G/videos/video-element-image-linkable.webm?fit=max&auto=format&n=DabTafNhExNz5i1G&q=85&s=d23efd8045a77f50c4eb0e864132f600" data-path="videos/video-element-image-linkable.webm" />

**Identificador:**

Define un nombre único para tu imagen enlazable. Este identificador es fundamental para que el sistema pueda contabilizar correctamente los clics en los reportes y análisis de rendimiento.

**Destino del Enlace:**

Después de activar la imagen enlazable, podrás conectar la imagen a otras páginas de tu flujo o funciones específicas a través del sistema de conexiones.

**Reglas Importantes**

* **Activación**: Para activar la imagen enlazable, primero debes definir un identificador único.
* **Conexión Obligatoria**: Después de activar, es obligatorio conectar la imagen a un destino en el flujo antes de finalizar la configuración.
* **Desactivación Segura**: Para desactivar la imagen enlazable, primero debes eliminar la conexión en el flujo. Esto evita que los usuarios hagan clic en una imagen sin destino definido.
* **Seguimiento**: El identificador permite que el sistema rastree y reporte correctamente los clics en la imagen en los reportes de rendimiento.

**Consejo para imágenes enlazables**

Cuando uses imágenes enlazables, elige identificadores descriptivos y únicos (ej: "boton-cta-principal", "enlace-producto-destacado"). Esto facilitará el análisis de los reportes y ayudará a identificar qué elementos están generando más engagement en tu flujo.

## Recomendación de tamaño

Para mejores resultados, usa imágenes en formato cuadrado con dimensiones de 1080 x 1080 píxeles.
Este tamaño asegura calidad óptima y adaptación visual tanto en escritorio como en móvil, sin cortes o distorsiones. ¡Ideal para capturas de pantalla, iconos grandes o imágenes destacadas!

## Consejo de uso

Usa este elemento para destacar una imagen que realmente necesita atención. Evita exageraciones y prefiere imágenes con buena resolución. Es genial para cuando quieres enfocar la mirada del visitante en un detalle visual específico de tu oferta, diagnóstico o contenido.