> ## 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.

# Progreso

> Barra de progreso para mostrar avanço

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

La barra de progreso es un gran recurso visual para mostrar al usuario dónde está en el embudo.
Ayuda a mantener el compromiso, ya que da una sensación clara de progreso y anima a completar los pasos.

**Para qué sirve**

* Mostrar al visitante cuánto del embudo ha sido completado.

* Aumentar la tasa de finalización, ya que las personas tienden a terminar algo cuando ven que están cerca del final.

* Mejorar la experiencia de navegación.

**Lo que puedes configurar**

* **Porcentaje final**

Debes informar manualmente el porcentaje correspondiente a esta página, teniendo en cuenta el número total de páginas en tu embudo.

Ejemplo: si tu embudo tiene 4 páginas, la primera puede ser 25%, la segunda 50%, la tercera 75% y la última 100%.

**Progreso inteligente:** al definir el porcentaje de cada página, la barra se ajustará automáticamente, mostrando el progreso suavemente entre una etapa y otra.

* **Colores personalizados**

Color inicial y final de la barra (para crear un efecto de gradiente o destacar la evolución).

Color de fondo, que representa la sección aún no completada.

**¡Consejo estratégico!**

Usa este elemento en embudos con más de una pregunta o paso, especialmente cuando hay un formulario al final.
Esto ayuda al usuario a saber que está casi ahí y previene abandonos a mitad del camino.
