Bootstrap 5 Login Form with Company Logo

August 19, 2023

This Bootstrap login form template has a simple yet elegant interface. It uses the Bootstrap 5 framework and has a responsive layout. It is straightforward to use and customize.

Bootstrap 5 Login Form with Company Logo

This Bootstrap login form template features the company logo, a prominent login button, new signup, and forgot password links. You can blend this free Bootstrap login form snippet into any project quickly.

Preview Get Code

More Snippets Join BS Brain

Tools

Bootstrap 5 Snippet Update

We have updated this Bootstrap snippet to Bootstrap 5.3.2 and BSB Framework 2.0.2. We have rechecked this Bootstrap component on Oct 5, 2023.

Best Ready to Use Web Themes & Templates

Download Now

Features

Bootstrap 5
HTML5 Validation
HTML5 & CSS3
W3C Valid
Commented Code
Bootstrap Icons

Responsive Layout
Login Elements
Clean Snippet
SEO Optimized
Easy to Use
Cross Browser Compatible

Browse

<!-- Login 1 - Bootstrap Brain Component -->
<div class="bg-light py-3 py-md-5 py-xl-8">
  <div class="container">
    <div class="row justify-content-md-center">
      <div class="col-12 col-md-11 col-lg-8 col-xl-7 col-xxl-6">
        <div class="bg-white p-4 p-md-5 rounded shadow-sm">
          <div class="row">
            <div class="col-12">
              <div class="text-center mb-5">
                <a href="#!">
                  <img src="./assets/img/bsb-logo.svg" alt="" width="175" height="57">
                </a>
              </div>
            </div>
          </div>
          <form action="#!">
            <div class="row gy-3 gy-md-4 overflow-hidden">
              <div class="col-12">
                <label for="email" class="form-label">Email <span class="text-danger">*</span></label>
                <div class="input-group">
                  <span class="input-group-text">
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-envelope" viewBox="0 0 16 16">
                      <path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4Zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1H2Zm13 2.383-4.708 2.825L15 11.105V5.383Zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741ZM1 11.105l4.708-2.897L1 5.383v5.722Z" />
                    </svg>
                  </span>
                  <input type="email" class="form-control" name="email" id="email" required>
                </div>
              </div>
              <div class="col-12">
                <label for="password" class="form-label">Password <span class="text-danger">*</span></label>
                <div class="input-group">
                  <span class="input-group-text">
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-key" viewBox="0 0 16 16">
                      <path d="M0 8a4 4 0 0 1 7.465-2H14a.5.5 0 0 1 .354.146l1.5 1.5a.5.5 0 0 1 0 .708l-1.5 1.5a.5.5 0 0 1-.708 0L13 9.207l-.646.647a.5.5 0 0 1-.708 0L11 9.207l-.646.647a.5.5 0 0 1-.708 0L9 9.207l-.646.647A.5.5 0 0 1 8 10h-.535A4 4 0 0 1 0 8zm4-3a3 3 0 1 0 2.712 4.285A.5.5 0 0 1 7.163 9h.63l.853-.854a.5.5 0 0 1 .708 0l.646.647.646-.647a.5.5 0 0 1 .708 0l.646.647.646-.647a.5.5 0 0 1 .708 0l.646.647.793-.793-1-1h-6.63a.5.5 0 0 1-.451-.285A3 3 0 0 0 4 5z" />
                      <path d="M4 8a1 1 0 1 1-2 0 1 1 0 0 1 2 0z" />
                    </svg>
                  </span>
                  <input type="password" class="form-control" name="password" id="password" value="" required>
                </div>
              </div>
              <div class="col-12">
                <div class="d-grid">
                  <button class="btn btn-primary btn-lg" type="submit">Log In</button>
                </div>
              </div>
            </div>
          </form>
          <div class="row">
            <div class="col-12">
              <hr class="mt-5 mb-4 border-secondary-subtle">
              <div class="d-flex gap-2 gap-md-4 flex-column flex-md-row justify-content-md-center">
                <a href="#!" class="link-secondary text-decoration-none">Create new account</a>
                <a href="#!" class="link-secondary text-decoration-none">Forgot password</a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- CSS Files -->
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://unpkg.com/bs-bra[email protected]/components/logins/login-1/assets/css/login-1.css" />

Use in personal projects
Customize the template files
Number of websites/domains
Create websites for clients
Remove footer credit link
Working PHP/AJAX contact form
Sass/SCSS Files
JS Source Files
Premium support via Email
Forum support
Free Updates
Access to all 5 Pro Templates
Access to all 34 Pro Components
Use in SaaS
Resell & Redistribute

BB Startup

Freelancer

^$49

3 Months Access

5 Pro BS Templates

34 Pro BS Components

Use in personal projects
Customize the template files
Unlimited Number of websites/domains
Create websites for clients
Remove footer credit link
Working PHP/AJAX contact form
Sass/SCSS Files
JS Source Files
Premium support via Email
Forum support
3 Months Free Updates
Access to all our 5 Pro Templates
Access to all our 34 Pro Components
~~Use in SaaS~~
~~Resell & Redistribute~~

Buy Now

BB Club

Agency

^$149

12 Months Access

5 Pro BS Templates

34 Pro BS Components

Use in personal projects
Customize the template files
Unlimited Number of websites/domains
Create websites for clients
Remove footer credit link
Working PHP/AJAX contact form
Sass/SCSS Files
JS Source Files
Premium support via Email
Forum support
12 Months Free Updates
Access to all our 5 Pro Templates
Access to all our 34 Pro Components
Use in SaaS
~~Resell & Redistribute~~

Buy Now

Bootstrap 5 Login Form Snippets

Browse our best free Bootstrap login form template snippets with HTML5 validation. You will love this premium quality free Bootstrap login form template collection. These Bootstrap login form templates are responsive, modern, and readily customized. You can blend these login form components into your Bootstrap projects without hassle.