37 Plantillas gratuitas de formularios de contacto Bootstrap 2021

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 es necesario que lo cree usted mismo.

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

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

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

Los 37 mejores formularios de contacto gratuitos de Bootstrap

Formulario de contacto 1 por Colorlib

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

El título del formulario es 'Ponte en contacto', que es un título significativo y adecuado para este tipo de formularios. 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 estirar el campo del mensaje si prefiere un campo de texto más grande para ingresar el mensaje.

Más información / Descargar Demo

Formulario de contacto 2 por Colorlib

Contact Form 2 hecho 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 por otro. Por ejemplo, puede reemplazar este texto con " Manténgase en contacto " o algún otro texto adecuado.

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

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

Más información / Descargar Demo

Formulario de contacto 3 por 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.

Como esta plantilla le proporciona dos formularios para dos propósitos, será muy conveniente para el usuario y también será útil para usted.

Al hacer clic en el campo de presupuesto, aparecen algunos presupuestos de muestra de los que 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 información / Descargar Demo

Formulario de contacto 4 por Colorlib

Contact Form 4 de Colorlib es una increíble plantilla de formulario de contacto gratuita que se puede agregar en cualquier sitio web.

Si necesita un formulario de contacto para que sus clientes potenciales puedan contactarlo, esta plantilla de formulario será una buena opción para usted. Mediante este formulario, sus clientes potenciales pueden consultar sobre los servicios que brinda .

El usuario debe elegir un servicio sobre el que desea conocer. Él / ella puede 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 sepa en qué servicio están interesados, será MÁS FÁCIL comunicarse con sus clientes potenciales.

Más información / Descargar Demo

Formulario de contacto 5 por Colorlib

El Formulario de contacto 5 creado por Colorlib es un formulario de contacto de Bootstrap gratuito y agradable.

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 enviar es muy ancho , es tan ancho como el campo del mensaje.

Cuando hace clic en el campo 'Servicios necesarios', aparece una lista desplegable. Es una lista de servicios. Sus clientes potenciales pueden ELEGIR entre estos servicios. Si proporciona diferentes servicios, puede cambiar esta lista del código.

Más información / Descargar Demo

Formulario de contacto 6 por Colorlib

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

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 del mensaje.

El botón de enviar tiene un EFECTO de desplazamiento interesante.

Si hace clic en el botón enviar sin ingresar ningún valor en los campos de texto, los mensajes de error se muestran 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, como 'jfghdf', se mostrará un mensaje de error .

Más información / Descargar Demo

Formulario de contacto 7 por Colorlib

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

El título del formulario es "Póngase 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 iconos y textos de marcador de posición adecuados. Estos iconos y los textos de los marcadores de posición han hecho que el formulario sea más FÁCIL DE USAR.

Hay una casilla de verificación debajo del campo del mensaje con el título "Enviar copia a mi correo electrónico". Entonces, si el usuario desea obtener una copia de los datos ingresados, puede obtenerlos en su dirección de correo electrónico.

Más información / Descargar Demo

Formulario de contacto 8 por Colorlib

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

Esta forma tiene efectos interesantes . Cuando haces clic en los campos de texto, puedes ver efectos visuales geniales. La calidad general de esta forma 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 del 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 la leyenda "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 información / Descargar Demo

Formulario de contacto 9 por Colorlib

Esta es otra increíble plantilla de formulario de contacto desarrollada por Colorlib. Esta es una plantilla gratuita. Por lo tanto, no tiene que gastar dinero para usarlo en su 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.

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

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

Más información / Descargar Demo

Formulario de contacto 10 por Colorlib

Este hermoso formulario de contacto Bootstrap gratuito creado por Colorlib es una plantilla de formulario de contacto de muy alta calidad. Los cuadros de texto redondos, el botón redondo y una GRAN combinación de colores utilizados en esta plantilla han hecho que la forma sea hermosa.

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

Cuando haces clic en los cuadros de texto, crecen un poco de ancho. El usuario puede ampliar el campo del mensaje arrastrando la esquina inferior derecha de este campo.

Entonces, si el mensaje del usuario no encaja en este cuadro de texto, él / ella puede agrandar el cuadro.

Se implementó la validación del formulario. Entonces, si el usuario deja los campos obligatorios vacíos o ingresa valores no válidos y hace clic en el botón 'enviar', aparecerán mensajes de error.

Más información / Descargar Demo

Formulario de contacto 11 por Colorlib

El trasfondo de este formulario es asombroso. Realzará la belleza de su sitio web. Esta es una plantilla de formulario de contacto Bootstrap simple pero poderosa . En este formulario, hay dos campos de texto obligatorios 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 mensajes son opcionales. Por lo tanto, si el usuario no ingresa la URL de su sitio web o si 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 pongan en contacto con usted.

Más información / Descargar Demo

Formulario de contacto 12 por Colorlib

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

Cuando pase el mouse sobre este ícono de mensaje, se moverá un poco.

Puede ver otro gran efecto visual cuando hace 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 realmente genial.

Hay tres campos de texto en este formulario, que son el campo de nombre, el campo de correo electrónico y el campo de mensaje. Las esquinas de los cuadros de texto y el botón son redondas.

Más información / Descargar Demo

Formulario de contacto 13 por Colorlib

El Formulario de contacto 13 fabricado por Colorlib tiene un aspecto único. En el lado izquierdo, hay un mapa y puede 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 el formulario se vea similar al diseño de su sitio web.

Más información / Descargar Demo

Formulario de contacto 14 por Colorlib

Este formulario de contacto es uno de los mejores formularios de contacto hechos por Colorlib. Hay un buen trasfondo 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 gratuita y totalmente personalizable diseñada en gran medida con Bootstrap.

En este formulario de contacto, el nombre, el correo electrónico y el campo del mensaje son campos obligatorios mientras que los demás son opcionales. El usuario debe ingresar un valor en los campos obligatorios.

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 muy bien, siempre tiene la opción de mejorar el diseño. Puede realizar los cambios NECESARIOS para que el diseño de este formulario coincida con el diseño de su sitio web.

Más información / Descargar Demo

Formulario de contacto 15 por Colorlib

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

Los campos de texto parecen modernos porque se han utilizado líneas simples para los campos de texto en lugar de cuadros de texto rectangulares. Para cada campo de texto, hay un texto de marcador de posición adecuado, cuyo color de texto es gris.

Al hacer clic en los campos de texto, los textos de los marcadores 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 no es apropiada para su sitio web, puede REEMPLAZAR esta imagen por otra diferente.

Más información / Descargar Demo

Formulario de contacto 16 por 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 formulario de contacto de Bootstrap increíble y gratuito para su sitio web, puede considerar usar este formulario. Este formulario es lo suficientemente genial 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 un par de 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 información / Descargar Demo

Formulario de contacto 17 por Colorlib

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

Entonces, si el usuario lo desea, también puede contactarlo a través de su número de teléfono y correo electrónico. Y también tiene la opción de acudir físicamente a la oficina de su empresa a través de la dirección que se proporciona en este apartado.

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

Para cada uno de los campos de texto, hay un TÍTULO encima del campo de texto. Cada pie de foto se coloca dentro de un rectángulo con líneas finas y grises.

Más información / Descargar Demo

Formulario de contacto V01

Contact Form V01 es un widget moderno y gratuito que puede insertar en su sitio web con facilidad. Deje que sus usuarios se pongan en contacto con usted cómodamente, sin necesidad de levantar el teléfono.

Contact Form V01 también tiene un diseño dividido con el formulario en un lado y detalles adicionales de la compañía en el otro.

También puede agregar un enlace a la página de inicio en caso de que quieran continuar navegando por su contenido y no salir SOLO TODAVÍA.

Más información / Descargar Demo

Formulario de contacto V02

Independientemente del tipo de sitio web que ejecute, una sección de contacto es prácticamente obligatoria. El formulario de contacto 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 Bootstrap, el diseño fluido también garantiza una gran adaptabilidad a pantallas más pequeñas.

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

Más información / Descargar Demo

Formulario de contacto V03

Formulario de contacto V03 es una gran alternativa gratuita si se desea crear una página de contacto en toda regla en su sitio web.

No solo obtienes un formulario funcional, sino que también hay una sección de IMAGEN y detalles EXTRA 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 información / Descargar Demo

Formulario de contacto V04

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

Como en 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 información / Descargar Demo

Formulario de contacto V05

Si es muy activo en las redes sociales y obtiene excelentes resultados, le gustaría tener enlaces a los que se encuentran repartidos por todo su sitio web.

INCLUYENDO la página / formulario de contacto.

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

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

Más información / Descargar Demo

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 buscarlo manualmente.

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

Tampoco es necesario que clasifique el formulario de autocompletado y validación, ya que el Formulario de contacto V06 viene con ambos integrados de forma predeterminada.

Más información / Descargar Demo

Formulario de contacto V07

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

Puede utilizar el formulario de contacto V07 tal como está, pero también puede dar un paso más y modificarlo.

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

Más información / Descargar Demo

Formulario de contacto V08

Puede hacer que el widget de contacto de su sitio web resalte más agregando un fondo de imagen. 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 le da un toque agradable con la imagen de fondo.

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

Más información / Descargar Demo

Formulario de contacto V09

Solo diré una cosa, deje que esta plantilla de formulario de contacto gratuita hable todo en mi lugar. Fondo oscuro, detalles dorados, texto gris y blanco - WOW.

Una herramienta que permitirá que todos disfruten completando la información que falta cuando necesiten ponerse en contacto con usted.

El widget también está en perfecta armonía con los dispositivos móviles y cuenta con autocompletado y validación.

¿Qué más necesitas?

Más información / Descargar Demo

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 pasa cuando se trata del formulario de contacto V10.

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

En caso de que el visitante de su sitio web necesite su número de teléfono o solo su dirección, esta plantilla le PERMITE incluirlos también.

Más información / Descargar Demo

Formulario de contacto V11

Contact Form V11 es una de las plantillas de formulario de contacto más minimalistas que hemos lanzado. 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 sale de la caja.

Pero también puede mantenerlo completamente TAL CUAL.

Más información / Descargar Demo

Formulario de contacto V12

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

El Formulario de contacto V12 es otra excelente herramienta que requiere una realización completa de los resultados en poco o ningún tiempo .

Contact Form V12 es muy 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 información / Descargar Demo

Formulario de contacto V13

Con el fondo degradado, Contact Form V13 se destaca entre las masas. Con todos los diferentes widgets y fragmentos gratuitos que publicamos, siempre nos aseguramos de ofrecerle 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 información / Descargar Demo

Formulario de contacto V14

Aquí tenemos el Formulario de contacto V14, perfecto para empresas y agencias por defecto. De hecho, funciona idealmente para una agencia de marketing , pero también puede usarlo para otra cosa.

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

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

Más información / Descargar Demo

Formulario de contacto V15

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

¿Por qué 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, utilice el Formulario de contacto V15 y evite crear la página de contacto desde cero.

Más información / Descargar Demo

Formulario de contacto V16

Contact Form V16 es un formulario de contacto ENGAGING para agencias, empresas y autónomos. Pero realmente, incluso si tiene un blog, también puede incluir esta pegadiza plantilla Bootstrap gratuita.

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

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

Más información / Descargar Demo

Formulario de contacto V17

Si bien probablemente ya tenga DETALLES DE LA COMPAÑÍA e información de contacto en el área del 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 información / Descargar Demo

Formulario de contacto V18

Contact Form V18 es otra versión de una plantilla gratuita de formulario de contacto Bootstrap con Google Maps. Con el diseño DOS EN UNO, este widget le ofrece 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 información / Descargar Demo

Formulario de contacto V19

Si desea que los visitantes de su sitio y los clientes / clientes potenciales proporcionen 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. Funciona muy bien desde el primer momento, gracias a su aspecto extremadamente minimalista.

Otra característica interesante es el efecto de clic en el botón: adelante, compruébalo por ti mismo.

Más información / Descargar Demo

Formulario de contacto V20

Realmente solo necesitas cuatro campos si quieres ir directo al grano con un formulario de contacto. El formulario de contacto V20 incluye campos para nombre, correo electrónico y asunto, además del área de texto.

El diseño también está en perfecta armonía con los teléfonos inteligentes, tabletas y computadoras de escritorio, lo que garantiza una experiencia de usuario fantástica.

Más información / Descargar Demo