Home
Lekhraj Ghimire
Sign In Form

Sign In Form

Clean and modern Sign In form with email, password, and "Forgot password" link. Fully responsive and styled with Tailwind CSS, perfect for SaaS platforms.

This tailwind example is contributed by Lekhraj Ghimire, on 18-Jun-2025. Component is made with Tailwind CSS v3. It is responsive. It supports dark mode. similar terms for this example are CTA,banner,Register, Sign in

Call to Action Login Form

Author Lekhraj Ghimire

551

Fork Fullscreen

<div class="max-w-md mx-auto p-8 bg-white shadow-xl rounded-xl border border-gray-200">
  <h2 class="text-2xl font-bold text-center text-blue-600 mb-6">Sign In</h2>
  <form class="space-y-4">
    <div>
      <label class="block mb-1 text-sm text-gray-600">Email Address</label>
      <input type="email" class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="you@example.com" required>
    </div>
    <div>
      <label class="block mb-1 text-sm text-gray-600">Password</label>
      <input type="password" class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="••••••••" required>
    </div>
    <div class="flex items-center justify-between">
      <label class="flex items-center">
        <input type="checkbox" class="mr-2">
        <span class="text-sm text-gray-600">Remember me</span>
      </label>
      <a href="#" class="text-sm text-blue-500 hover:underline">Forgot password?</a>
    </div>
    <button type="submit" class="w-full bg-blue-600 text-white py-2 rounded-lg hover:bg-blue-700 transition">Sign In</button>
  </form>
  <p class="text-sm text-center text-gray-500 mt-6">Don't have an account? <a href="#"
      class="text-blue-500 hover:underline">Sign Up</a></p>
</div>

Related Examples

Login page
Login and register page, you can reuse both

Author:
Abhiraj

10 months ago

1.7k
Contact us Form with Responsive

Author:
KULDEEP

4 months ago

370
Registration Form with Validation & Success State
A modern and interactive registration form built using Tailwind CSS and Alpine.js, designed for seamless user onboarding with real-time validation and elegant animations. This component includes client-side form validation, dynamic password visibility toggles, and a success confirmation screen with personalized feedback. It’s fully responsive, dark mode–ready, and styled for modern SaaS or startup platforms. ✨ Key Features 🧠 Real-time input validation for required fields (name, email, password, etc.) 🔒 Show/hide password toggle with animated SVG icons ✅ Success message with user details after submission 💨 Animated transitions using Alpine.js 🌙 Dark mode and light mode compatible 📱 Fully responsive across all screen sizes 🧩 Built with pure Tailwind CSS and Alpine.js (no external libraries) 💡 Perfect for: Registration or sign-up pages SaaS onboarding flows Portfolio or agency login systems Form validation demos or UI component libraries

Author:
wavy kits

1 month ago

48
Simple Login Form
Login Form Responsive Component

Author:
Ahita Bisma Adlula

9 months ago

1.1k
Animated Iogin form
This section showcases a series of interactive image cards that reveal descriptive text on hover. Built using Tailwind CSS and Astro.js, each card features a smooth animation, background blur, and opacity transition, enhancing the user experience while presenting visually engaging content.

Author:
nicoleshal07

6 months ago

394
Simple Login & Register Page
Login and Register Page using Tailwind, Alpine JS, and Fontawesome

Author:
Ahita Bisma Adlula

9 months ago

2.7k
Call to Action section
CTA with clear message and big button

Author:
magersa

1 year ago

4.5k
Modern Sign Up Page
Dive into a world of cool animations and captivating visuals. This beautifully crafted interface is not only eye-catching but also highly functional. You can use it as-is or customize it to make it your own. Share your ideas, and let’s create something extraordinary together!” Feel free to tweak it further or add any specific details you’d like. 😊🎨

Author:
Ari Mustofa

1 year ago

2.4k
Login Form
Bigger input field Login form. like bootstrap input-lg

Author:
muhittin budak

7 months ago

580
Login template

Author:
Gabriel Urbano

1 year ago

6.2k
Sign In form

Author:
Amit Pachange

2 years ago

12.2k
SliceHeaven
delivering pizza

Author:
INGRIDE MUZIRANENGE

5 months ago

462

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components