Forms
Add different layouts of forms in your
webpage
You can remove/add your own input
fields and create your own color scheme of forms.
To change the gradient of submit button you can use the CSS variable : --submit-initial and --submit-final.
Login form
<div class="login-div">
<div class="login-title">
Login Form</div>
<form action="#">
<div class="field">
<input type="text" required>
<label>Email Address</label>
</div>
<div class="field">
<input type="password" required>
<label>Password</label>
</div>
<div class="login-att">
<div class="checkbox">
<input type="checkbox" id="remember-me">
<label for="remember-me">Remember me</label>
</div>
<div class="pass-link">
<a href="#">Forgot password?</a></div>
</div>
<div class="field">
<input type="submit" value="Login">
</div>
<div class="signup-link">
Not a member? <a href="#">Signup now</a></div>
</form>
</div>
Contact us form
<div class="contact-div">
<div class="contact-text text-dark">
Responsive Contact us Form</div>
<form action="#">
<div class="form-row">
<div class="input-data">
<input type="text" required>
<div class="underline">
</div>
<label for="">First Name</label>
</div>
<div class="input-data">
<input type="text" required>
<div class="underline">
</div>
<label for="">Last Name</label>
</div>
</div>
<div class="form-row">
<div class="input-data">
<input type="text" required>
<div class="underline">
</div>
<label for="">Email Address</label>
</div>
<div class="input-data">
<input type="text" required>
<div class="underline">
</div>
<label for="">Website Name</label>
</div>
</div>
<div class="form-row">
<div class="input-data">
<input type="text" required>
<div class="underline">
</div>
<label for="">Write a message</label>
</div>
<div class="input-data">
<input type="text" required>
<div class="underline">
</div>
<label for="">Suggestions/Review</label>
</div>
</div>
<div class="form-row submit-btn ">
<div class="input-data bg-dark text-bright">
<input type="submit" value="submit">
</div>
</div>
</form>
</div>
