"Bootstrap Simple Registration Form"
Bootstrap 4.1.1 Snippet by Salonimalhotrawd

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="signup-form"> <h2>Register</h2> <p class="hint-text"> Create your account. It's free and only takes a minute. </p> <form> <div class="form-group"> <div class="row"> <div class="col-sm-6 col-md-6 col-xs-6"> <input type="text" class="form-control" name="first_name" required="required" placeholder="First Name"> </div> <div class="col-sm-6 col-md-6 col-xs-6"> <input type="text" class="form-control" name="last_name" placeholder="Last Name" required="required"> </div> </div> </div> <div class="form-group"> <input type="text" class="form-control" name="email" placeholder="Email" required="required"> </div> <div class="form-group"> <input type="password" placeholder="Password" name="password" required="required" class="form-control"> </div> <div class="form-group"> <input type="password" class="form-control" name="Confirm Password" placeholder="Confirm Password"> </div> <div class="form-group"> <label> <input type="checkbox"> I accept the <a href="#">Terms of Use</a> & <a href="#">Privacy Policy</a> </label> </div> <div class="form-group"> <button type="submit" class="btn btn-success btn-block btn-lg"> Register Now </button> </div> </form> </div>
.body{ color: #fff; background: #63738a; font-family: 'Roboto', sans-serif; } .signup-form{ width:500px; padding:30px 0; margin: 0 auto; } .form-control{ height:40px; color:#969fa4; box-shadow:none; } .form-control:focus{ border-color:#5cb85c; } form-control .btn{ border-radius: 3px; } .signup-form h2{ text-align:center; } .signup-form .hint-text{ color:#999; text-align:center; } .signup-form form{ color: #999; border-radius: 3px; margin-bottom: 15px; background: #f2f3f7; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); padding: 30px; } .signup-form a{ color: #5cb85c; }

Related: See More


Questions / Comments: