→ Anonymous
→ Login Form

Login Form

This Example is contributed by Anonymous, on 30-Mar-2025. It is responsive. similar terms for this example is Form Component

Form Authentication

Author Anonymous

Fork Fullscreen

<div class="login-container">
  <div class="login-form">
    <div class="login-header">
      <h1>Log In</h1>
      <p>Welcome back! Please enter your details</p>
    </div>
    <form id="loginForm">
      <div class="form-group">
        <label for="email">Email</label>
        <input type="email" id="email" name="email" placeholder="Enter your email" required>
        <span class="error-message" id="email-error"></span>
      </div>
      <div class="form-group">
        <label for="password">Password</label>
        <input type="password" id="password" name="password" placeholder="Enter your password" required>
        <span class="error-message" id="password-error"></span>
      </div>
      <div class="form-options">
        <div class="remember-me">
          <input type="checkbox" id="remember" name="remember">
          <label for="remember">Remember me</label>
        </div>
        <a href="#" class="forgot-password">Forgot password?</a>
      </div>
      <button type="submit" class="login-button">Log In</button>
      <div class="login-footer">
        <p>Don't have an account? <a href="#" class="signup-link">Sign up</a></p>
      </div>
    </form>
  </div>
</div>

Related Examples