Bootstrap 5 Login form with social buttons

Loading…

Bootstrap 5 Login form with social buttons | GoSnippets

Source Code

1<div class="container">
2    <div class="row d-flex justify-content-center mt-5">
3        <div class="col-12 col-md-8 col-lg-6 col-xl-5">
4            <div class="card py-3 px-2">
5                <p class="text-center mb-3 mt-2">SE CONNECTER AVEC</p>
6                <div class="row mx-auto ">
7                    <div class="col-4"> <i class="fab fa-twitter"></i> </div>
8                    <div class="col-4"> <i class="fab fa-facebook"></i> </div>
9                    <div class="col-4"> <i class="fab fa-google"></i> </div>
10                </div>
11                <div class="division">
12                    <div class="row">
13                        <div class="col-3">
14                            <div class="line l"></div>
15                        </div>
16                        <div class="col-6"><span>OU AVEC MON EMAIL</span></div>
17                        <div class="col-3">
18                            <div class="line r"></div>
19                        </div>
20                    </div>
21                </div>
22                <form class="myform">
23                    <div class="mb-3"> <input type="email" class="form-control" placeholder="Email"> </div>
24                    <div class="mb-3"> <input type="password" class="form-control" placeholder="Mot de passe"> </div>
25                    <div class="row">
26                        <div class="col-md-6 col-12">
27                            <div class="mb-3 form-check"> <input type="checkbox" class="form-check-input" id="exampleCheck1"> <label class="form-check-label" for="exampleCheck1">Rester connecte</label> </div>
28                        </div>
29                        <div class="col-md-6 col-12 bn">Mot se passe oublie</div>
30                    </div>
31                    <div class="mb-3 mt-3"> <button type="button" class="btn w-100 btn-primary btn-lg"><small><i class="far fa-user pe-2"></i>Se connecter</small></button> </div>
32                </form>
33            </div>
34        </div>
35    </div>
36</div>

Bootstrap 5 Login form with social buttons

Source Code

More Forms snippets

Comments(0)

Working in Tailwind? Explore our Tailwind gallery