Cómo hacer que el fondo de tu formulario sea transparente

18 de junio de 2025

Hacer que el fondo de tu formulario sea transparente es una manera sencilla de integrarlo perfectamente con el diseño de tu sitio web. Esto puede ayudar a que tu formulario tenga una apariencia más limpia y mejor integrada, sin abrumar la estética de la página.

En el Creador de Formularios de Jotform, puedes ajustar fácilmente el fondo de tu formulario utilizando las siguientes funciones:

Diseñador de Formularios

La forma más fácil de cambiar la transparencia de tu formulario es a través del Diseñador de Formularios.

  1. En el Creador de Formularios, haz clic en el Diseñador de Formularios (icono de rodillo de pintura) en el lado derecho de la página.
Icono de Rodillo de Pintura para Abrir el Diseñador de Formularios en Jotform
  1. En la pestaña Colores, en el cuadro Color del Formulario, establece el color escribiéndolo como Transparente.
Pestaña de Colores ajustando el Color del Formulario en el Diseñador de Formularios Jotform

O, haz clic en la Xicono de las opciones de color que se muestran en el cuadro de Color del Formulario.

Pestaña de Colores ajustando el Color usando el Cuadro de Colores en el Diseñador de Formularios Jotform

Diseñador Avanzado

Si eres un experto en diseño de formularios, el diseñador avanzado ofrece opciones de estilo más avanzadas, incluido el color de fondo del formulario.

  1. En el Diseñador de Formularios, haz clic en el botón Diseñador Avanzado en la parte inferior para cargar tu formulario en la página del Diseñador Avanzado.
Botón del Diseñador Avanzado para abrir la Página del Diseñador Avanzado
  1. En Esquema de Color, haz clic en Marco y ajusta su transparencia usando el deslizador. Haz lo mismo para el Fondo.
Opción de Esquema de Color para Hacer Transparente el Fondo de la Entrada
  1. Asegúrate de hacer clic en el botón Guardar en el lado izquierdo de la página para aplicar los cambios. Consulta Cómo acceder y usar el Diseñador Avanzado para más información.

Código CSS Personalizado

Recomendamos este método si deseas probar todo, incluyendo eliminar la sombra y el borde del formulario. En la pestaña Estilos, desplázate hacia abajo hasta el cuadro de Inyectar CSS Personalizado, y pega el siguiente código CSS:

.supernova, .jotform-form, .form-all {
background-color: transparent !important;
}
.form-all {
box-shadow: none;
border: none;
}
Inyectar código CSS personalizado en el Diseñador de Formularios Jotform

Ver también:

Contactar Soporte

Our customer support team is available 24/7 and our average response time is between one to two hours.

Enviar Comentario:

Jotform Avatar
Este sitio está protegido por reCAPTCHA y lo rigen la Política de privacidad de Google y los Términos de servicio.

Podo Comment Sea el primero en comentar.