→ Mustaq hussin
→ form-validation

form-validation

This bootstrap css example is contributed by Mustaq hussin, on 25-Jul-2026. Component is made with bootstrap css v.4.6. It is responsive.

Tags: Form

Author Mustaq hussin

v.4.6

Fork Fullscreen

<div class="container">
    <form id="contactForm" novalidate>
      <div class="mb-3">
        <label for="name" class="form-label">Name</label>
        <input type="text" class="form-control" id="name">
        <div class="form-feedback text-danger" id="nameFeedback"></div>
      </div>
      <div class="mb-3">
        <label for="email" class="form-label">Email</label>
        <input type="email" class="form-control" id="email">
        <div class="form-feedback text-danger" id="emailFeedback"></div>
      </div>
      <div class="mb-3">
        <label for="phone" class="form-label">Phone</label>
        
        <input type="number" class="form-control" id="phone">
        <div class="form-feedback text-danger" id="phoneFeedback"></div>
      </div>
      <div class="mb-3">
        
        <label for="address" class="form-label">Address</label>
        <input type="text" class="form-control" id="address">
        <div class="form-feedback text-danger" id="addressFeedback"></div>
      </div>
      <div class="mb-3">
        <label for="message" class="form-label">Message</label>
        <textarea class="form-control" id="message"></textarea>
        <div class="form-feedback text-danger" id="messageFeedback"></div>
      </div>
      <button type="submit" class="btn btn-custom bg-primary">Submit</button>
      <div class="form-success text-success mt-2" id="successMessage"></div>
    </form>
  </div>

More Examples

vulgh

Author:
Anonymous

2 weeks ago

82

v.5.3
contact us

Author:
java stories story

1 year ago

3.9k

v.5.3
Form validation by donald trump
form validation

Author:
Faysal

3 weeks ago

109

v.4.6
Simple Login form

Author:
Prajwal Hallale

2 years ago

9.9k

v.5.3
Contact us form

Author:
Anonymous

2 years ago

8.2k

v.4.6
yash from
amr from ta keow copy korbe nha .korle tui morog chor

Author:
rimon majumder

3 months ago

161

v.4.6
HTML and Bootstrap for Registration Form
HTML: Personal Information Section: Includes fields for full name, email, date of birth, bio, and profile image. Company Information Section: Includes fields for company name, company size (using a dropdown), and location. Submit Button: A button to submit the form. CSS: Background Gradient: Applied to the body. Card Styling: Styled with rounded corners and padding. Button Styling: Custom colors for the submit button. Validation Styling: Highlight invalid fields and display error messages. JavaScript: Validation Logic: Checks if required fields are filled and updates the feedback area with error or success messages. Dynamic Feedback: Updates the form with success or error messages based on validation.

Author:
zobaidul kaziex

1 year ago

9.1k

v.4.6
HTML, CSS, and Bootstrap. This approach will be purely HTML and CSS without any JavaScript.
HTML: Bootstrap Integration: Linked to Bootstrap CDN for styling. Form Structure: Contains input fields for name, email, and message, all within a card component. CSS: Background Gradient: Applied to the body for a visually appealing background. Card Styling: Rounded corners and padding for the card. Button Styling: Custom colors for the submit button, including hover effects. How to Use: Create an index.html file and copy the above code into it. Open the HTML file in your web browser to view the Contact Us form.

Author:
zobaidul kaziex

1 year ago

3.2k

v.4.6
Bootstrap Form with Javascript Validation

Author:
User

3 weeks ago

110

v.4.6
new-validation-form
new-validation-form

Author:
Anonymous

3 weeks ago

103

v.4.6
Restrurant Website
Only for me

Author:
Zahid Hasan Riyad

1 month ago

148

v.5.3
progress-steps
progress-steps

Author:
Rami AlAjo

1 year ago

2.6k

v.4.6

Didn't find component you were looking for?

Search from 300+ componenent