37 plantillas gratuitas de formularios de contacto de Bootstrap 2022

Siempre estamos buscando nuevos fragmentos, pero en el caso de los formularios de contacto de Bootstrap, necesitábamos crear los nuestros.

A pesar de que probamos 100 y algunos eran bastante sólidos, decidimos tomar las cosas en nuestras manos.

Con esto, le prometemos las plantillas más confiables, frescas y actualizadas que FUNCIONAN PARA CUALQUIER blog o sitio web.

Un formulario de contacto es imprescindible para cada sitio web, pero ahora no necesita crearlo usted mismo.

Nos aseguramos de cubrir todo tipo de estilos con más de 35 diseños diferentes.

Lo que es mejor, nuestros formularios de contacto gratuitos también son fáciles de editar y configurar. (Lea: personalización simple.)

Haga que la sección de contacto necesaria suceda rápidamente.

Formulario de contacto 1 de Colorlib

Contact Form 1 desarrollado por Colorlib, es un formulario de contacto genial diseñado con Bootstrap. Este formulario de contacto se ve COOL debido a la excelente elección de colores.

El título del formulario es "Ponte en contacto", un título significativo y adecuado para este formulario. En el lado izquierdo del formulario, hay un hermoso ícono de mensaje que ha mejorado la apariencia de esta plantilla de formulario.

Esta plantilla de formulario le proporciona 4 campos de texto para nombre, dirección de correo electrónico, asunto y mensaje. El usuario puede ampliar el campo del mensaje si prefiere un campo de texto más grande para ingresar el mensaje.

Más info / Descargar

Formulario de contacto 2 de Colorlib

El formulario de contacto 2 creado por Colorlib es una hermosa plantilla de formulario de contacto gratuita diseñada con Bootstrap.

El título del formulario es 'Contáctenos'. Aunque este título es lo suficientemente apropiado, puede cambiar este texto a algún otro texto. Por ejemplo, puede reemplazar este texto con ' Mantenerse en contacto ' u otro texto adecuado.

Este formulario tiene solo tres campos de texto: nombre, dirección de correo electrónico y mensaje. También puede agregar más campos del código. Por ejemplo, puede agregar un campo de asunto para ingresar el asunto del mensaje.

El usuario debe ingresar valores de texto VÁLIDOS. Si ingresan textos no válidos, se muestran mensajes de error cuando el usuario pasa el mouse sobre los campos de texto.

Más info / Descargar

Formulario de contacto 3 de Colorlib

Este formulario de contacto de Colorlib tiene DOS opciones. Para cada opción, aparece un formulario de contacto diferente. Una opción es simplemente decir "hola", mientras que el otro formulario de contacto es para obtener una cotización.

Esta plantilla le proporciona dos formularios para dos propósitos, será muy conveniente para el usuario y útil para usted.

Al hacer clic en el campo de presupuesto, aparecen algunos presupuestos de muestra de los cuales el usuario puede seleccionar un presupuesto. Al hacer clic en el campo 'Servicios necesarios', aparece una lista desplegable con una lista de servicios.

Más info / Descargar

Formulario de contacto 4 de Colorlib

Contact Form 4 de Colorlib es una impresionante plantilla de formulario de contacto gratuita que se puede agregar a cualquier sitio web.

Si necesita un formulario de contacto para comunicarse con sus clientes potenciales, esta plantilla de formulario será una buena opción para usted. A través de este formulario, sus clientes potenciales pueden consultar sobre sus servicios.

El usuario tiene que elegir un servicio sobre el que quiere saber. Pueden seleccionar un servicio de la lista desplegable con el título "Servicios necesarios" en esta plantilla de formulario.

Desde el campo de presupuesto, el usuario puede seleccionar su presupuesto. Cuando pueda conocer el presupuesto de su cliente potencial y cuando pueda saber en qué servicio está interesado, será MÁS FÁCIL para usted comunicarse con sus clientes potenciales.

Más info / Descargar

Formulario de contacto 5 de Colorlib

El formulario de contacto 5 creado por Colorlib es un excelente formulario de contacto de Bootstrap gratuito.

Hay textos de marcador de posición en los campos de texto, que describen los campos. El título del formulario está en negrita con el texto 'Contáctenos'. El botón de envío es muy amplio ; es tan ancho como el campo del mensaje.

Aparece una lista desplegable cuando hace clic en el campo "Servicios necesarios". Es una lista de servicios. Tus clientes potenciales pueden ELEGIR entre estos servicios. Si proporciona servicios diferentes, puede cambiar esta lista del código.

Más info / Descargar

Formulario de contacto 6 de Colorlib

Este es uno de los mejores formularios de contacto de Bootstrap desarrollados por Colorlib. Esta plantilla muestra un mapa y un icono de un mensaje sobre él.

Al hacer clic en el icono de mensaje, aparece el formulario de contacto. En el formulario de contacto, hay tres campos de texto. En estos campos de entrada, el usuario puede ingresar su nombre, dirección de correo electrónico y el mensaje que desea enviar. Hay un hermoso botón de envío debajo del campo de mensaje.

El botón Enviar tiene un emocionante EFECTO de desplazamiento.

Si hace clic en el botón Enviar sin ingresar ningún valor en los campos de texto, los mensajes de error aparecen en rojo.

El usuario debe ingresar la dirección de correo electrónico en el formato de correo electrónico correcto. Si su usuario ingresa una dirección de correo electrónico no válida, se mostrará un mensaje de error .

Más info / Descargar

Formulario de contacto 7 de Colorlib

Contact Form 7 es un formulario de contacto muy estándar desarrollado por Colorlib. Tiene un diseño muy familiar. Entonces, si usa este formulario de contacto en su sitio web, su sitio se verá más profesional .

El título del formulario es "Ponte en contacto". Este formulario tiene cuatro campos de texto. El usuario puede ingresar su nombre, dirección de correo electrónico, número de teléfono y un mensaje a través de este formulario.

En los campos de texto, hay textos e iconos de marcador de posición adecuados. Estos íconos y los textos de marcador de posición han hecho que el formulario sea más FÁCIL DE USAR.

Hay una casilla de verificación debajo del campo de mensaje con 'Enviar copia a mi correo electrónico'. Entonces, si el usuario desea obtener una copia de los detalles ingresados, puede enviarlos a su dirección de correo electrónico.

Más info / Descargar

Formulario de contacto 8 de Colorlib

Contact Form 8 es una excelente plantilla gratuita de formulario de contacto de Bootstrap creada por Colorlib con un mapa como fondo.

Esta forma tiene efectos interesantes . Cuando hace clic en los campos de texto, puede ver efectos visuales geniales. La calidad general de este formulario es muy alta.

Hay textos de marcador de posición apropiados para que los usuarios puedan entender qué ingresar en un campo en particular. Por ejemplo, el texto del marcador de posición del campo de mensaje es "Su mensaje".

Al ver este texto, el usuario puede comprender rápidamente que necesita ingresar un mensaje en este campo.

El botón con el título 'ENVIAR CORREO ELECTRÓNICO' se ve muy bien. Su color de fondo es verde claro y el color del texto es blanco. Cuando pasa el mouse sobre el botón, el color de fondo cambia a verde oscuro.

Más info / Descargar

Formulario de contacto 9 de Colorlib

Esta es otra impresionante plantilla de formulario de contacto desarrollada por Colorlib. Esta es una plantilla accesible. Así que no tienes que gastar dinero para usarlo en tu sitio web.

Y también es personalizable al mismo tiempo, lo que significa que puede realizar cambios en esta plantilla de acuerdo con sus requisitos y preferencias.

Cuando hace clic en los cuadros de texto, puede ver un EFECTO VISUAL interesante. Si no ingresa ningún valor en ellos, aparecerán mensajes de error en rojo. Se muestra un mensaje de error si ingresa una dirección de correo electrónico con un formato de correo electrónico incorrecto en el formulario de correo electrónico.

Alternativamente, hay un número de teléfono en la parte inferior, pero debe cambiarlo a su número de contacto real.

Más info / Descargar

Formulario de contacto 10 de Colorlib

Este hermoso y gratuito formulario de contacto de Bootstrap creado por Colorlib es una plantilla de formulario de contacto de muy alta calidad. Los cuadros de texto redondos, los botones redondos y una GRAN combinación de colores utilizada en esta plantilla han completado el formulario de forma hermosa.

Hay un pequeño icono colocado en el botón 'enviar'. Debido a este ícono, el botón se ve muy interesante. También hay un efecto de desplazamiento.

Cuando hace clic en los cuadros de texto, aumentan ligeramente de ancho. El usuario puede ampliar el campo del mensaje arrastrando la esquina inferior derecha.

Entonces, si el mensaje del usuario no cabe en este cuadro de texto, puede agrandar el cuadro.

Se ha implementado la validación de formularios. Entonces, si el usuario deja vacíos los campos obligatorios o ingresa valores no válidos y hace clic en el botón "Enviar", aparecerán mensajes de error.

Más info / Descargar

Formulario de contacto 11 de Colorlib

Esta es una plantilla de formulario de contacto de Bootstrap simple pero poderosa. El fondo de este formulario es increíble. Mejorará la belleza de su sitio web. Hay dos campos de texto obligatorios en este formulario y los otros dos campos de texto son opcionales.

Los campos obligatorios están marcados con una estrella. El sitio web y los campos de mensaje son opcionales. Entonces, si el usuario no ingresa la URL de su sitio web o no proporciona un mensaje de texto en este formulario, no se mostrarán mensajes de error.

Pero el usuario debe ingresar su nombre y dirección de correo electrónico en los campos correspondientes.

Este hermoso formulario de contacto será una MANERA RÁPIDA para que sus clientes se comuniquen con usted.

Más info / Descargar

Formulario de contacto 12 de Colorlib

Contact Form 12 es una de las plantillas de formulario de contacto más fantásticas desarrolladas por Colorlib. Este formulario se ve MUY COOL y tiene excelentes efectos visuales. Hay un icono de mensaje en el lado izquierdo del formulario.

Se moverá un poco cuando pase el mouse sobre este ícono de mensaje.

Puedes ver otro gran efecto visual al hacer clic en los cuadros de texto.

Detrás del formulario, hay una imagen de edificios. Esto ha aumentado la belleza de este formulario de contacto. La combinación de colores utilizada en esta plantilla es genial.

Este formulario tiene tres campos de texto: campo de nombre, campo de correo electrónico y campo de mensaje. Las esquinas de los cuadros de texto y el botón son redondas.

Más info / Descargar

Formulario de contacto 13 de Colorlib

El Formulario de contacto 13 hecho por Colorlib se ve único. En el lado izquierdo, hay un mapa, y puedes ver el formulario en el lado derecho. Un número de teléfono es visible en la sección del mapa .

El formulario de contacto tiene todos los campos de entrada necesarios, pero si cree que necesita más campos de entrada, puede agregar más campos en cualquier momento desde el código de esta plantilla.

Al igual que los otros formularios de contacto desarrollados por Colorlib, este formulario también es GRATUITO y TOTALMENTE personalizable, lo que significa que no tiene que gastar dinero para integrarlo en su sitio web y puede realizar los cambios necesarios.

Aunque este formulario parece muy estándar, es posible que deba cambiar ligeramente el diseño para que se parezca al diseño de su sitio web.

Más info / Descargar

Formulario de contacto 14 de Colorlib

Este formulario de contacto es uno de los mejores formularios de contacto creados por Colorlib. Hay una excelente base detrás de este formulario. Al igual que las otras plantillas mencionadas en esta publicación de blog, esta también es una plantilla de formulario de contacto totalmente personalizable y gratuita diseñada excepcionalmente con Bootstrap.

El campo de nombre, correo electrónico y mensaje son campos obligatorios en este formulario de contacto, mientras que los otros son opcionales. El usuario debe ingresar un valor en los campos requeridos.

El usuario no puede enviar un mensaje a través de este formulario de contacto, dejando vacíos los campos obligatorios.

Aunque este formulario se ve excelente, siempre tienes la opción de mejorar el diseño. Puede realizar los cambios NECESARIOS para crear este formulario que coincida con el diseño de su sitio web.

Más info / Descargar

Formulario de contacto 15 de Colorlib

Contact Form 15 de Colorlib es una plantilla de formulario de contacto gratuita FANTÁSTICA diseñada con Bootstrap, integrada en cualquier sitio web. Puede ver un mapa detrás del formulario.

Los campos de texto tienen un aspecto moderno porque se han utilizado líneas individuales para los campos de texto en lugar de cuadros de texto rectangulares. Hay un texto de marcador de posición adecuado para cada campo de texto, cuyo color de texto es gris.

Al hacer clic en los campos de texto, los textos de marcador de posición desaparecen y las líneas de los campos de texto se vuelven verdes, lo que mejora la experiencia del usuario .

En la parte superior del formulario, puede ver una bonita imagen de un hombre que trabaja con una computadora portátil. Si cree que esta imagen es inapropiada para su sitio web, puede REEMPLAZAR esta imagen con una diferente.

Más info / Descargar

Formulario de contacto 16 de Colorlib

Contact Form 16 es también una de las plantillas de formulario de contacto más impresionantes desarrolladas por Colorlib. No solo se ve genial, también es simple , hermoso y poderoso .

Si está buscando un excelente formulario de contacto de Bootstrap gratuito para su sitio web, puede considerar usar este formulario. Este formulario es lo suficientemente bueno y se puede integrar FÁCILMENTE como cualquier otro formulario de contacto mencionado en esta publicación de blog.

Si conoce los conceptos básicos del desarrollo web, puede agregar este formulario a su sitio en solo unos minutos.

Detrás del formulario, hay una gran imagen. Hay otra imagen en la parte superior del formulario, que ha mejorado el aspecto de esta plantilla de formulario.

Y puede ver efectos ESPECIALES al hacer clic en los campos de texto.

Más info / Descargar

Formulario de contacto 17 de Colorlib

Contact Form 17 es una plantilla de formulario de contacto de Bootstrap hermosa, gratuita y totalmente personalizable diseñada por Colorlib. Hay una bonita imagen en el lado izquierdo del formulario con información de contacto, como una dirección, un número de teléfono y una dirección de correo electrónico.

Así que si el usuario quiere, también puede contactarte a través de número de teléfono y correo electrónico. Y también tienen la opción de ir físicamente a visitar la oficina de su empresa a través de la dirección facilitada en este apartado.

Este formulario parece único porque los campos de texto son diferentes de los campos de texto tradicionales que se usan en otros formularios de contacto y otros tipos de formularios web.

Hay un TÍTULO sobre el campo de texto para cada uno de los campos de texto. Cada subtítulo se coloca dentro de un rectángulo con líneas grises finas.

Más info / Descargar

Formulario de contacto V01

Contact Form V01 es un widget moderno y gratuito que puede insertar fácilmente en su sitio web. Permita que sus usuarios se comuniquen con usted de manera conveniente, sin levantar el teléfono.

El formulario de contacto V01 también luce un genial diseño dividido con el formulario en un lado y detalles adicionales de la empresa en el otro.

También puede agregar un enlace de regreso a la página de inicio si desean continuar navegando por su contenido y no irse AÚN.

Más info / Descargar

Formulario de contacto V02

Independientemente del tipo de sitio web que ejecute, una sección de contacto es obligatoria. Contact Form V02 está aquí para resolver las cosas con un diseño limpio que también le ofrece agregar detalles adicionales.

Dado que es un formulario de contacto de Bootstrap, el diseño fluido también garantiza una gran adaptabilidad a pantallas más pequeñas.

Por cierto, el widget TAMBIÉN admite autocompletar y validación.

Más info / Descargar

Formulario de contacto V03

El formulario de contacto V03 es una excelente alternativa gratuita si desea crear una página de contacto completa en su sitio web.

No solo obtiene un formulario funcional, sino que también hay una sección de IMAGEN y detalles ADICIONALES de la empresa, como dirección, teléfono y correo electrónico.

En cuanto al formulario, es bastante básico con cuatro campos y un botón con efecto de desplazamiento.

Más info / Descargar

Formulario de contacto V04

Hay varias formas de realzar el área de contacto, siendo el efecto GRADIENTE una de ellas. Si esto es algo que le gusta, Contact Form V04 es nuestra plantilla gratuita basada en Bootstrap Framework que funciona.

Al igual que muchos de nuestros otros formularios de contacto en esta lista, este también viene con una sección adicional para agregar dirección, teléfono, correo electrónico e incluso un enlace a la página de inicio.

Más info / Descargar

Formulario de contacto V05

Si eres muy activo en las redes sociales y obtienes excelentes resultados, querrás tener enlaces a esos repartidos por todo tu sitio web.

INCLUYENDO la página/formulario de contacto.

El formulario de contacto V05 es un gran ejemplo, pero con muchas características adicionales además de los enlaces de redes sociales.

Incluso puede consultar la demostración en vivo en diferentes dispositivos antes de continuar.

Más info / Descargar

Formulario de contacto V06

A muchos les gusta la idea de mostrar la ubicación de su empresa en un MAPA para que el usuario no tenga que buscarla manualmente.

Contact Form V06 tiene un excelente diseño dividido con un formulario e integración con Google Maps para su conveniencia.

Tampoco necesita ordenar el autocompletado y la validación del formulario, ya que el Formulario de contacto V06 viene con ambos integrados de forma predeterminada.

Más info / Descargar

Formulario de contacto V07

Estoy bastante seguro de que muchos de ustedes estaban buscando exactamente esta alternativa: el formulario de contacto gratuito de Bootstrap con un diseño OSCURO.

Le invitamos a utilizar el Formulario de contacto V07 tal como está, pero también puede dar un paso más y modificarlo.

Por ejemplo , puede interesarle cambiar el color del botón "enviar mensaje", incluso las fuentes.

Más info / Descargar

Formulario de contacto V08

Puede hacer que el widget de contacto de su sitio web se destaque más agregando una imagen de fondo. Pero en lugar de hacer que suceda DESDE CERO, ahora puede usar el formulario de contacto V08.

Este formulario de contacto gratuito de Bootstrap es bastante sencillo, pero agrega un toque agradable con la imagen de fondo.

Tenga en cuenta que siempre puede mejorar las cosas , haciendo que el fragmento siga las normas de su marca.

Más info / Descargar

Formulario de contacto V09

Solo diré una cosa, deja que esta plantilla de formulario de contacto gratuita hable por mí. Fondo oscuro, detalles dorados, texto gris y blanco: WOW.

Una herramienta que permitirá a todos disfrutar completando la información faltante cuando necesiten ponerse en contacto contigo.

El widget también es perfectamente armonioso con los dispositivos móviles y cuenta con autocompletado y validación.

Que más necesitas?

Más info / Descargar

Formulario de contacto V10

Fondo de imagen de pantalla completa, diseño transparente y formulario de contacto de color sólido: eso es lo que sucede cuando se trata de Formulario de contacto V10.

Mientras que los detalles adicionales y el formulario están uno al lado del otro en el escritorio, se mueven uno encima del otro en el móvil.

Si el visitante de su sitio web necesita su número de teléfono o su dirección solamente, esta plantilla le PERMITE incluirlos.

Más info / Descargar

Formulario de contacto V11

Contact Form V11 es una de las plantillas de formulario de contacto más minimalistas jamás lanzadas. Lo bueno de eso es que funciona con diferentes temas y estilos de sitios web listos para usar.

Además de cambiar el color del botón "enviar mensaje", puede usarlo exactamente como viene de la caja.

Pero también puede mantenerlo completamente TAL CUAL.

Más info / Descargar

Formulario de contacto V12

¿Necesita plantillas de formulario de contacto de Bootstrap más minimalistas? Aquí vamos.

El formulario de contacto V12 es otra herramienta excelente que requiere la realización de un resultado completo en poco o nada de tiempo .

Contact Form V12 es fácil de usar, gracias al código organizado y bien estructurado. Puede realizar mejoras rápidamente incluso como principiante en el espacio de desarrollo web.

Más info / Descargar

Formulario de contacto V13

Con el fondo degradado, Contact Form V13 se destaca de las masas. Con todos los diferentes widgets y fragmentos gratuitos que lanzamos, siempre le ofrecemos tantas variaciones como sea posible.

Lo MISMO se aplica a los formularios de contacto.

El formulario de contacto V13 es ideal para empresas y agencias, ya que también incluye detalles de contacto adicionales e incluso una sección para compartir algunas palabras convincentes.

Más info / Descargar

Formulario de contacto V14

Tenemos el formulario de contacto V14, perfecto para empresas y agencias por defecto. Funciona idealmente para una agencia de marketing , pero también puede usarlo para otra cosa.

Por ejemplo, si ejecuta un sitio de noticias y ofrece anuncios, es entonces cuando también entra en juego este formulario de contacto gratuito.

Puede usar la sección de la izquierda para CONVENCER aún más al cliente potencial para que trabaje con usted.

Más info / Descargar

Formulario de contacto V15

Contact Form V15 es moderno y minimalista al mismo tiempo. Debido a su estilo limpio y audaz, puede mantener su sección de contacto muy audaz pero sencilla.

¿Por qué incluso usar demasiadas distracciones?

Pero eso es algo que depende de una empresa a otra.

Para seguir el flujo de la simplicidad de su sitio web, use el Formulario de contacto V15 y evite crear la página de contacto desde cero.

Más info / Descargar

Formulario de contacto V16

El formulario de contacto V16 es un formulario de contacto atractivo para agencias, empresas y autónomos. Pero, incluso si tiene un blog, puede incluir esta atractiva plantilla gratuita de Bootstrap.

Hay tres campos para nombre, correo electrónico, asunto y un área de texto para el mensaje.

Contact Form V16 también es compatible con la validación y el autocompletado de formularios, lo que lo hace aún más práctico.

Más info / Descargar

Formulario de contacto V17

Si bien es probable que ya tenga DETALLES DE LA EMPRESA e información de contacto en el área de pie de página, también puede agregarla al lado del formulario de contacto.

Para lograr un gran resultado rápidamente , es cuando opta por el Formulario de contacto V17.

Nombre, correo electrónico, teléfono, empresa y área de texto son los cinco campos predefinidos que puede usar tal cual o mejorar aún más. Además, si desea embellecerlo con una combinación de colores diferente, hágalo.

Más info / Descargar

Formulario de contacto V18

Contact Form V18 es otra versión de una plantilla de formulario de contacto de Bootstrap gratuita con Google Maps. Con el diseño DOS EN UNO, este widget le permite ordenar rápidamente una sección de contacto en su sitio web.

Es una gran alternativa ya que puede usarlo en una página separada o incluso incluirlo en su sitio web de una página.

Más info / Descargar

Formulario de contacto V19

Si desea que los visitantes de su sitio y los clientes potenciales brinden un poco de información adicional, un formulario de contacto con un menú desplegable puede ser muy útil.

El formulario de contacto V19 es la herramienta gratuita que ahora puede emplear independientemente de las regulaciones de su marca. Gracias a la apariencia extremadamente minimalista, funciona muy bien desde el primer momento.

Otra característica interesante es el efecto de clic del botón: adelante, compruébelo usted mismo.

Más info / Descargar

Formulario de contacto V20

Realmente solo necesita cuatro campos para mantenerlo directo con un formulario de contacto. Contact Form V20 presenta campos para nombre, correo electrónico y asunto, además del área de texto.

El diseño también es perfectamente armonioso con teléfonos inteligentes, tabletas y computadoras de escritorio, lo que garantiza una experiencia de usuario fantástica.

Más info / Descargar