36 Free Bootstrap Form Templates & Examples 2026
This list collects 36 free Bootstrap form templates for the forms most sites need: registration, login, contact, booking and multi-step wizards, plus six newer 2026 forms for appointments, surveys, job applications, newsletters, checkout and sales enquiries. Every entry has a live demo and a free download.
Updated September 2026: the 29 older Colorlib downloads were rebuilt as dependency-free HTML, CSS and a few lines of vanilla JavaScript, and the six 2026 forms are built the same way. They load no jQuery, Bootstrap files or plugins, and look the same on their own or dropped into a Bootstrap 4, 5 or 6 layout. They are free for personal and commercial use under CC BY 3.0, as long as you keep the credit link. The last entry in the main list, a flat login form by Colorlib founder Aigars Silkalns, lives on CodePen.
A login form usually needs just two fields: a username or email address and a password. A registration form generally has more than two text fields. In the registration form, you can request various pieces of information, such as name, email address, address, mobile number, and photo. However, asking for too many things in the first step is not a good practice. It will annoy your users, and they will likely leave your site if the registration form contains too many fields.
A contact form typically includes text fields for name, email address, subject, message, budget, and the services required, among others. Some contact forms have just an email field and a message field.
Best Free Bootstrap Form Templates
Colorlib Reg Form v1
This is a great Bootstrap-ready registration form made by Colorlib. This is a free template like all other templates mentioned in this post. You can download it for free, modify it, and integrate it into your website. This form has a nice blue background. On top of the form, there’s a beautiful picture of buildings. This kind of image will enhance the beauty of your website.
The form’ Registration info’ has an appropriate title and 5 text fields. Depending on your website type, you may require more or fewer text fields, as well as different types of text fields. For instance, you may need a text or email field for the budget. As this form is fully customizable, you can change the text fields. Add or remove fields as needed. The download fell from 1.2 MB to 825 KB in the rebuild, and the drop-downs are real select menus, so their values are sent with the form.
Colorlib Reg Form v2
This is another great registration form developed by Colorlib. It has a nice, red background. On the left side of the form, there’s a beautiful picture of fruits, which enhances the webpage’s appearance.
This form also has a suitable title, ‘registration info’. If you want, you can change it to some other text. For example, change it to ‘Sign Up’ or ‘Create an account’. As this is a fully customizable form, changing things is very easy.
This registration form consists of five input fields: two text fields, one date picker, and two drop-down lists. The date picker is the browser’s own, so phones get their native calendar. Each input field has a proper placeholder text.
This form looks modern because the text fields have thin lines instead of rectangular boxes.
If you like this form, you can download it by clicking the ‘Download’ button below.
Colorlib Reg Form v3
Colorlib Reg Form v3 is a stylish registration form that drops into any Bootstrap project without changing its look. On the form’s left side is a picture of a woman. The background color used for the text and input fields is black, so the text in this form appears bright. This registration form includes input fields for name, birth date, gender, email address, and phone number. Below the text fields, there’s a nice green submit button with white text.
This form contains various types of input fields. Not all the input fields are text fields. For example, there is a drop-down list in addition to the text fields. The user can select an option from the drop-down list and the selected option will appear in the input field.
The submit button looks great because the corners are round and the color combination is amazing.
To view this form closely, click the ‘Preview’ button below for a preview.
Colorlib Reg Form v4
Colorlib Reg Form v4 is a cool, free form template that works on its own or inside Bootstrap 4, 5 and 6 pages. The choice of colors makes this form look cool. The form’s title is ‘Registration Form’, which should be changed to something more suitable. You can replace it with ‘Register now, ”Sign Up,’ or ‘Create an account.’ This form title is just a sample text. You need to change it to a more meaningful title.
The input fields have proper captions. There are input fields for first name, last name, birthday, gender, email address, phone number, and subject. Some are text fields, while others are different kinds of input fields. For example, the birthday field is not a text field; it opens the browser’s own date picker, so phones get their native calendar. The gender field has radio buttons. The subject field provides a drop-down list, allowing the user to select a subject from the list.
Colorlib Reg Form v5
Colorlib Reg Form v5 is a standard, high-quality, free registration form, ready for Bootstrap projects but built without Bootstrap files. This is a fully customizable form template made by Colorlib. As you can see, the title of the form is ‘event registration form’. As the title suggests, this form is designed for event registration.
This form includes appropriate input fields for name, company name, email, phone, subject, and more. There are two text fields for the name field: the first name and the last name. The phone field also has two text fields: the area code and the phone number. The subject field features a drop-down list that allows users to select a subject from a list of available subjects.
If you use this form, edit the subjects in the drop-down list. It is a real select menu, styled to match, so the chosen subject is sent with the form.
Colorlib Reg Form v6
This is a great Colorlib registration form that you can use to receive job applications. So, using this form, people can apply for jobs. This application form looks very standard and professional.
This form has just 4 input fields: full name, email address, message, and a CV. The applicant can upload a CV. The input fields have proper captions and placeholder texts. You can change the placeholder texts if you require different placeholder texts.
In the Name field, the applicant must enter their full name. Then, they have to enter their email address in the email field. Next, the applicant can enter a message to send to the employer in the message field. Finally, the applicant must upload a CV from their computer.
The ‘Send Application’ button looks fantastic because of its blue background and white text. This one needs no JavaScript at all: it is plain HTML and CSS.
Login Form v1 by Colorlib
Login Form v1 by Colorlib is an awesome, free, fully customizable login form template for Bootstrap or plain HTML sites. The image tilt and the validation are a few lines of vanilla JavaScript, and the download dropped from 4.4 MB to 242 KB. The left side of the form has a cool picture of a laptop. The form title is ‘Member Login,’ which indicates that this is the member login section. In other words, members can sign in from this section.
This beautiful login form has two text fields and a nice, green login button. The text fields and the login button have round corners. Due to the rounded corners, the form looks great. The text fields have proper placeholder texts and small icons, making the form very user-friendly because these elements clearly indicate the purpose of each field.
Below the login button is a ‘forgot username/password’ link, and there’s a signup link at the bottom of the form. The overall quality of the form is great.
Login Form v2 by Colorlib
Login Form v2 is a modern, Bootstrap-ready login form made by Colorlib. This form looks and feels modern because the text fields are unique. They are different from traditional text fields. They have thin lines instead of rectangular boxes, and their color changes when you click on them. The form also appears modern due to the login button. Multiple colors have been used in the button, and it’s as wide as the text fields.
When you type in this field, password fields appear. There’s a little eye icon on the right side of the password field; clicking it allows you to hide/show the password. By default, the password entered in the password field is hidden. However, if you need to view the actual password, click the eye icon located on the right side of the field. That toggle works without jQuery.
Login Form v3 by Colorlib
Login Form v3, made by Colorlib, is a free login form template that you can easily integrate into your website, whether it runs Bootstrap or not. This template has a background picture. Above the form title, a sample logo is displayed, which you can replace with your company logo. The text fields are modern—they only have bottom borders. The text fields also have small icons and proper placeholder texts.
There’s also a ‘Remember Me’ option below the text fields. Moreover, the login button features rounded corners.
This is a simple login form, so it doesn’t have many options. Although you can add more features, keeping the form simple is important. If you need a few other things such as a signup link, you can add them, but a simple form is best.
Login Form 4 by Colorlib
Login Form 4 is one of the best forms made by Colorlib. This free login form template has no framework dependencies, so it can be integrated into any website, including Bootstrap 4, 5 and 6 builds. It has a nice background with a ‘Login’ form title. Proper captions, placeholder texts, and icons have been used for the text fields. The placeholder texts are grey.
There are two text fields: the username and password fields. If your users want to log in with an email address, you must change the caption and the placeholder text for this field.
Below the password field, there’s a ‘Forgot Password’ link so the user can reset their password. Below the login button, you will find social icons. These icons are placed here to allow your site visitors to sign up using social media sites such as Facebook and Twitter.
Login Form 5 by Colorlib
Login Form 5 is a fantastic login form template made by Colorlib. This free form template is plain HTML, CSS and a little vanilla JavaScript, and it is fully customizable, allowing you to modify it according to your needs.
This form template looks simple, calm, and powerful. Social icons are displayed on the form, allowing users to sign in with them. And below, there are text fields and a login button. If users have an account with your site, they can log in with their username and password.
Please note that this is a sample login form. The user won’t log in to your website from this login page because it is not fully functional. You first have to add it to your site, and then write some extra code to make it work.
The color combination in this template is already brilliant, but you can change it if you prefer.
Login Form 6 by Colorlib
Login Form 6 is also another great work done by Colorlib. This form has a white background. The form title is ‘Welcome’; a small image of a smiling person is just below it. You can remove this image if it’s inappropriate for your website. You may also change the photo or replace it with your company logo.
The username and password fields are modern text fields with thin, grey lines, without the top, left, and right borders. When you click on a text field, the thin line becomes green. The floating labels need no library, and the download is 211 KB.
This form appeals to the eye, especially because of the green color used in this template. The green login button also looks great, with round corners and a wide button that matches the width of the text fields.
At the bottom of the form are the ‘forgot username/password’ and signup links in green.
Contact Form 1 by Colorlib
Contact Form 1 is another free, Bootstrap-compatible form template made by Colorlib. This is one of the coolest form templates we’ve developed yet. The form has a cool background. On the left side, you can see a nifty message icon.
The form title, ‘Get in touch,’ is perfect for a trusty contact form. This contact form has 4 text fields. The user must enter their name, email address, subject, and message in the text fields. These fields have proper placeholder texts, so the user can easily understand what to enter. The message field is larger than the other text fields.
The text fields and the ‘Send Email’ button have round corners. An arrow symbol appears just to the right of the caption.
Colorlib Booking Form V1
Colorlib Booking Form V1 is an engaging modern form for online bookings. It’s ideal for the tourism industry, especially when used out of the box.
But that’s not necessary, as you can perform modifications easily. Why? The free template’s code structure is beginner-friendly, so everyone can get the gist without sweating.
Colorlib Booking Form V4
There are apps for this, that, everything… and booking cars online is popular, too, these days. That’s what Colorlib Booking Form V4 specializes in: car rentals and even taxi firms.
The form includes multiple predefined fields, the browser’s own date picker, and multiple dropdowns for time selection. Desktop and mobile users will enjoy filling out the Colorlib Booking Form V4.
Colorlib Booking Form V7
Colorlib Booking Form V7 sorts out any type of availability check. By default, it can be used by airlines, but it can also be applied to other purposes.
Thanks to the convenient design and easy-to-edit code, there are many options. It is plain HTML and CSS with no Bootstrap files needed, and the layout adapts to any screen size.
Colorlib Booking Form V5
Colorlib Booking Form V5 adds fields if the previous booking form was more basic. It’s an excellent example of how a flight booking form should look online.
You can activate different types of trips, “from” and “to” destination, date pickers, and a travel class drop-down. The date pickers are the browser’s own, so there is no plugin to load.
Colorlib Booking Form V17
Booking rooms online is much simpler with the right form. Colorlib Booking Form V17 is here to make an immediate difference for your accommodation business.
By default, it contains all the necessary sections and even spices things up with an image, title, and text section. Make your site visitors want to book a room and enjoy your stunning location.
Colorlib Wizard 1
I also want to share a few free multi-step forms with you, AKA wizards. For instance, Colorlib Wizard 1 is a perfect tool for registrations.
It guides users through three steps to create a new account on your platform. It supports autocomplete, making the whole experience even more pleasant and fast. The steps and the drop-down menu work without a plugin.
Colorlib Wizard 6
Colorlib Wizard 6 is a fun way to create an account that ideally fits social platforms, as well as freelancer marketplaces. But really, you are welcome to modify it and use it for something else.
While the wizard’s background is gradient on the desktop, it’s plain on mobile. You can test it first with the live demo preview and then proceed from there. The rebuilt download is 173 KB, down from 2.2 MB.
Colorlib Wizard 10
If you want to add a registration form with payment details to your eCommerce platforms, don’t miss Colorlib Wizard 10. It has a clean and modern design and a three-step process for creating an account.
Colorlib Wizard 10 features autocomplete, gender, and language drop-down selection and the browser’s own date picker for DOB (date of birth).
Colorlib Wizard 15
This versatile, Bootstrap-ready form template is suitable for various businesses and agencies within the financial industry. The user completes multiple steps, providing personal information, bank information, and financial goals.
Luckily, you don’t need to work on responsiveness—Colorlib Wizard 15 is mobile-ready by default. Now, it’s your turn to make the template work for you. At 74 KB, it is the lightest Colorlib download in this list.
Colorlib Wizard 21
A wizard with predefined account and payment information fields for quick integration. You can add Colorlib Wizard 21 to your website or application as-is, but you can also further fine-tune it (if necessary).
The layout is fluid and needs no framework: the steps run on a few lines of vanilla JavaScript, and validation uses the browser’s built-in checks. Everyone will have a great experience using Colorlib Wizard 21 on desktop or mobile devices.
Colorlib Wizard 26
An advanced form booking wizard helps you sort things out on your website without starting from scratch. You will only need to undergo a few refinements, such as branding and text adjustments.
Making the changes will be a pleasant experience even for the utter beginner. Additionally, Colorlib Wizard 26 features well-structured and organized code, making it familiar to everyone. The steps work without a plugin.
Colorlib Wizard 30
Colorlib Wizard 30 is one of our most basic free form wizards, and it no longer needs Bootstrap or jQuery to switch between steps. You get three sections for name, email/password, and subject/comment.
That’s it.
You can use the number above or the “next step” button to move between each section/tab. The performance is also great across different devices and platforms, even when using the default background.
Contact Form 2 by Colorlib
If you’re looking for a great contact form for your website, this template is for you. It’s an amazing free, fully customizable contact form template by Colorlib that works with or without Bootstrap. A cool background picture makes the form visually appealing.
This form template provides you with three text fields with just thin lines. Upon clicking the text boxes, the color of the thin lines changes.
Data validation has been implemented in this form. All the fields are mandatory, so the user must enter appropriate values to send a message through this contact form. If you leave the fields empty or enter invalid values, error messages will be shown in red upon clicking the ‘Send Your Message’ button.
If the user needs a larger message field, they can make the form larger by dragging the bottom-right corner of the message field.
Contact Form 3 by Colorlib
Contact Form 3 is one of the finest form templates produced by Colorlib. This form template provides two contact forms: one for simply saying ‘hi’ and the other for requesting a quote. So if the user wants to say ‘hi’ or has some general message, they can use the first contact form. And if they’re going to get a quote, they can use the second one.
The first form contains only three text fields. The user can enter their name, email, and message. On the other hand, the second form has 5 input fields, of which only three are text fields while the others are drop-down lists.
The drop-down lists contain some items. They are real select menus, so the chosen values are sent with the form. If you plan to use this template, ensure that you modify the lists accordingly. The submit button is cool. Upon mouse hover, its background color changes from white to green.
Contact Form 4 by Colorlib
Contact Form 4 made by Colorlib is an amazing form template for Bootstrap and non-Bootstrap sites alike. It’s a free template. You can use it on your website at no cost. And it’s customizable at the same time. You can make necessary adjustments in the form to ensure it resembles your site and matches your site’s design.
Using this form, your site visitors can not only send a message but also let you know about the services they are interested in and provide an idea of their budget. When you understand what your potential customers want and their budget, it becomes easier for you to communicate with them. You will be able to communicate effectively with your potential buyers.
You can consider using it on your website if you’re searching for a great contact form.
Contact Form 5 by Colorlib
Contact Form 5 by Colorlib is a very nice, free contact form template that can be used on any website, with or without Bootstrap. If you plan to have a contact form on your website, you can use it because it is simple, powerful, and has all the necessary features.
Using this contact form will save you time, as you don’t need to create a form from scratch. However, you may have to spend some time tweaking the form. Using a contact form will also bring great business benefits.
This form has all the necessary input fields. But if you need more fields, you can always add more as this is a fully customizable form template. You can also remove some fields if you don’t require all of these text fields.
Flat HTML5/CSS3 Login Form by Aigars Silkalns
This is a fantastic, free Bootstrap login form made by Aigars Silkalns, founder of Colorlib. Flat design has been used in this form. This is a flat login form beautifully designed with Bootstrap. The flat login button and the text fields look simply amazing! The code of this template is very simple. So if you know the basics of web development, you can easily modify the code and enhance the design per your preferences.
This open-source form template does not have many elements. It has two text fields, a login button, and a signup link, so it’s a very simple yet powerful form. Keep in mind that simple forms are more effective. Using a simple form like this will bring great business benefits.
Although simple forms are powerful, you must remember that you should not eliminate the essential elements while simplifying a form.
More 2026 form templates from Colorlib
Newer forms from our 2026 snippets, each built around a real task: booking an appointment, answering a survey, applying for a job, subscribing, checking out and contacting sales.
Appointment Form V01: Doctor and clinic appointment request with filtered doctors and time slots
A clinic booking form with a department select that filters the doctor list, a date picker that rejects weekends and a grid of time-slot chips generated for the chosen day. Some slots show as taken and past times are hidden for today. A dark teal side column holds the clinic's hours, address, phone and a short what-to-bring list, and a confirmation panel echoes the doctor, date and time.
Best for: clinics, GP practices and medical centres. Plain HTML and CSS with a few lines of vanilla JavaScript, a 381 KB download, and it works on its own or inside a Bootstrap 4, 5 or 6 project.
Survey Form V01: Customer satisfaction survey with star rating, NPS scale and comments
A post-delivery satisfaction survey for a coffee roaster. It asks for a 1 to 5 star rating built from a native radio group, a 0 to 10 likelihood-to-recommend scale and optional comments with a character counter. Submitting shows a thank-you state with a discount code in place of the form.
Best for: order follow-up emails, post-purchase pages and customer feedback flows. Plain HTML and CSS with a few lines of vanilla JavaScript, a 284 KB download, and it works on its own or inside a Bootstrap 4, 5 or 6 project.
Job Application Form V01: Classic job application with personal details, CV upload and cover letter
A straightforward application form for a made-up robotics company, split into three numbered sections: personal details, CV and cover letter. The CV picker accepts PDF, DOC or DOCX up to 5 MB, shows the chosen file name and size, and can remove it again. Errors appear after a field is left or on submit, with a summary that names every field to fix.
Best for: careers pages, applicant tracking front ends and single-role job ads. Plain HTML and CSS with a few lines of vanilla JavaScript, a 534 KB download, and it works on its own or inside a Bootstrap 4, 5 or 6 project.
Newsletter Form V08: Split-card newsletter signup with name, email and frequency choice
A two-panel newsletter card: a deep teal panel with a wave pattern holds the pitch, bullet points and reader stats, and the right side holds the form. Readers enter a first name and email, pick Daily, Weekly or Monthly from radio cards that describe each option, and choose HTML or plain-text email. The success view echoes the name, email, frequency and format, and the panels stack on phones.
Best for: media newsletters that offer several sending frequencies. Plain HTML and CSS with a few lines of vanilla JavaScript, a 206 KB download, and it works on its own or inside a Bootstrap 4, 5 or 6 project.
Shopping Cart V05: One-page checkout with shipping method cards and a payment form
A single-page checkout with numbered sections for contact details, shipping address, shipping method and payment, next to an editable order summary. The shipping method radio cards change the shipping line and total, the card number is grouped as you type and checked with the Luhn algorithm, and the expiry field is masked to MM / YY. Everything uses native form validation and autocomplete tokens, and the Pay button shows the live total.
Best for: checkout pages for small online stores. Plain HTML and CSS with a few lines of vanilla JavaScript, a 573 KB download, and it works on its own or inside a Bootstrap 4, 5 or 6 project.
Pricing Table V11: Enterprise pricing with a contact sales form
Two self-serve plans for a compliance platform next to a dark Talk to sales card with a short inline form. The form relies on the browser's native validation for name, work email and company size, then swaps to a success message that receives focus and is announced as a status. A row of supported frameworks sits underneath.
Best for: B2B and enterprise SaaS pricing pages with a sales-led top tier. Plain HTML and CSS with a few lines of vanilla JavaScript, a 280 KB download, and it works on its own or inside a Bootstrap 4, 5 or 6 project.
How to choose a Bootstrap form template
Ask only for what you need. Every extra field costs completions. Reg Form V6 gets a job application down to name, email, message and CV. If you really need more, split it into steps the way Colorlib Wizard 1 spreads account creation over three.
Keep visible labels. Placeholder text disappears as soon as someone types and is a poor substitute for a label, for sighted users and screen readers alike. The floating labels in Login Form v3, v4 and v6 keep the field name on screen while the user types.
Use native inputs. A real date field or select menu opens the phone’s own picker and sends its value with the form. Reg Forms V1 to V4 and Colorlib Wizard 10 use the browser’s own date picker, and Contact Forms 3, 4 and 5 use real select menus.
Show errors where they happen. Contact Form 2 marks each empty or invalid field in red when you submit, and Job Application Form V01 adds a summary that names every field to fix. Browser-side checks are a convenience, so validate again on the server.
Check it at phone width. Side images and two-column layouts have to stack. Newsletter Form V08 stacks its two panels on phones and Colorlib Wizard 6 drops its gradient background on small screens. Keep buttons and radio options large enough to tap, roughly 44px high.
Frequently asked questions
Do these Bootstrap form templates need Bootstrap or jQuery? No. The Colorlib forms are plain HTML and CSS with a few lines of vanilla JavaScript, so they work on a page without Bootstrap and keep their design inside a Bootstrap 4, 5 or 6 project. If you would rather use Bootstrap’s own styling, swap the input classes for Bootstrap 5’s form-control and form-select.
Can I use them on client and commercial sites? Yes. The Colorlib forms are free for personal and commercial use under CC BY 3.0; just keep the credit link. The CodePen login form follows CodePen’s own licence terms.
How do I customise a form template? Edit the HTML to add, remove or rename fields, keeping each input’s name, id and matching label in step. Colours, fonts and spacing live in the template’s stylesheet.
How do I make a form send email? These are front-end templates, so none of them sends anything by itself. Set the form’s action to a script on your server, your CMS’s form handler or a form service, use method="post", and validate the data again on the server.
Final thoughts
For a quick start, take Reg Form V6 for a short application, Login Form v2 for a login screen with a show-password toggle, Contact Form 3 for a contact page with a quote request, and Colorlib Wizard 15 for a longer multi-step form.
Need more of one kind? See our collections of login forms, registration forms and contact forms.
Related Posts
Comments (0)