https://github.com/mdbootstrap/bootstrap-login-form

Responsive Login form built with Bootstrap 5. Lot of templates of signup forms and predefined form pages - various design, styles and functionalities.
https://github.com/mdbootstrap/bootstrap-login-form

bootstrap bootstrap-template bootstrap5 css form login login-forms responsive responsive-design sign-in sign-up

Last synced: about 1 month ago
JSON representation

Responsive Login form built with Bootstrap 5. Lot of templates of signup forms and predefined form pages - various design, styles and functionalities.

Host: GitHub
URL: https://github.com/mdbootstrap/bootstrap-login-form
Owner: mdbootstrap
License: other
Created: 2021-08-13T06:02:33.000Z (over 4 years ago)
Default Branch: main
Last Pushed: 2022-01-27T10:29:08.000Z (about 4 years ago)
Last Synced: 2025-06-30T09:07:45.647Z (10 months ago)
Topics: bootstrap, bootstrap-template, bootstrap5, css, form, login, login-forms, responsive, responsive-design, sign-in, sign-up
Language: JavaScript
Homepage: https://mdbootstrap.com/docs/standard/extended/login/
Size: 956 KB
Stars: 48
Watchers: 5
Forks: 21
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: License.pdf

Awesome Lists containing this project

README

Responsive Login form built with Bootstrap 5. Lot of templates of signup forms and predefined form pages. Various design, styles and functionalities.

Check out [Bootstrap Login Form Documentation](https://mdbootstrap.com/docs/standard/extended/login/) for detailed instructions & even more examples.

## Basic example

![Bootstrap 5 Login Form](https://mdbootstrap.com/img/Marketing/github/login/basic.png)

```html

Email address

Password

Remember me

Forgot password?

Don't have an account? Register

```

CSS

```css
.divider:after,
.divider:before {
content: "";
flex: 1;
height: 1px;
background: #eee;
}
.h-custom {
height: calc(100% - 73px);
}
@media (max-width: 450px) {
.h-custom {
height: 100%;
}
}
```

## How to use?

1. Download MDB 5 - free UI KIT

2. Choose your favourite customized component and click on the image

3. Copy & paste the code into your MDB project

[▶️ Subscribe to YouTube channel for web development tutorials & resources](https://www.youtube.com/MDBootstrap?sub_confirmation=1)

## More examples

[Bootstrap Login Form #2:
![Bootstrap 5 Login Form](https://mdbootstrap.com/img/Marketing/github/login/login-form-2.png)](https://mdbootstrap.com/docs/standard/extended/login/#section-2)

[Bootstrap Login Form #3:
![Bootstrap 5 Login Form](https://mdbootstrap.com/img/Marketing/github/login/login-form-3.png)](https://mdbootstrap.com/docs/standard/extended/login/#section-3)

[Bootstrap Login Form #4:
![Bootstrap 5 Login Form](https://mdbootstrap.com/img/Marketing/github/login/login-form-4.png)](https://mdbootstrap.com/docs/standard/extended/login/#section-4)

[Bootstrap Login Form #5:
![Bootstrap 5 Login Form](https://mdbootstrap.com/img/Marketing/github/login/login-form-5.png)](https://mdbootstrap.com/docs/standard/extended/login/#section-5)

[Bootstrap Login Form #6:
![Bootstrap 5 Login Form](https://mdbootstrap.com/img/Marketing/github/login/login-form-6.png)](https://mdbootstrap.com/docs/standard/extended/login/#section-6)

[Bootstrap Login Form #7:
![Bootstrap 5 Login Form](https://mdbootstrap.com/img/Marketing/github/login/login-form-7.png)](https://mdbootstrap.com/docs/standard/extended/login/#section-7)

___

## More extended Bootstrap documentation