Home
pratik bhajankar
Sign in form

Sign in form

includes Google login button

This tailwind example is contributed by pratik bhajankar, on 07-Jun-2024. Component is made with Tailwind CSS v3. It is responsive. It supports dark mode. similar terms for this example are Register, Sign in

Author pratik bhajankar

810

Fork Fullscreen

<div class="flex flex-col items-center justify-center px-6 py-8 mx-auto md:h-screen lg:py-0">
    <a href="/" class="flex items-center mb-6 text-2xl font-semibold text-gray-900 dark:text-white">
      <img class="w-8 h-8 mr-2" src="https://www.svgrepo.com/show/335276/oldelectrum-logo.svg" alt="osher.ai logo">
          
    </a>
    <div
      class="w-full bg-white rounded-lg shadow dark:border md:mt-0 sm:max-w-md xl:p-0 dark:bg-gray-800 dark:border-gray-700">
      <div class="p-6 space-y-4 md:space-y-6 sm:p-8">
        <h1 class="text-xl font-bold leading-tight tracking-tight text-gray-900 md:text-2xl dark:text-white text-center">
          Sign In Access
        </h1>
        <h2 class="text-center"> You must become  a member to Login and access <h2/>
<h2  class="text-center " > the entire site<h2/>

<div>
            <label for="email" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Email Address</label>
            <input type="email" name="login" id="email" class="bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-teal-600 focus:border-teal-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="name@company.com" required="">
          </div>
          <div>
            <label for="password" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Password</label>
            <input type="password" name="password" id="password" placeholder="••••••••" class="bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-teal-600 focus:border-teal-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" required="">
          </div>
          <div class="flex items-center justify-between">
            <div class="flex items-start">
             
             
            </div>
            <a href="" class="text-sm font-medium text-teal-600 hover:underline dark:text-teal-500">Forgot password?</a>
          </div>

<p class="text-sm text-center text-gray-500 dark:text-gray-400">
            Not a member yet? <a href=""
              class="font-medium text-teal-600 hover:underline dark:text-teal-500">Sign up</a>
          </p>
        </form>

</div>
    </div>
  </div>

</section>

Related Examples

Login Form with Icon

Author:
Prashant

2 years ago

14k
Sign-In Form with Tailwind CSS
Elegant sign in form

Author:
Carlos

2 months ago

374
Profile Form
Enhanced User Profile Form with Stunning Profile and Cover Image Fields

Author:
Samuel Abera

8 months ago

6.3k
Animated Sign in background
Sign-in page with floating blobs as background.

Author:
Nii Anyetei

3 months ago

1.1k
Login Form
Login Form

Author:
Md. Tofayel islam

3 months ago

335
Login popup modal
centered modal for gaining more attention from users, it also has social login buttons.

Author:
R Thapa

1 year ago

14k
Responsive login form with image

Author:
Anonymous

3 months ago

694
Extreme Signup Page
I create a signup page using html, tailwindcss and font awesome icons using cdn.

Author:
Akram Khan

5 months ago

912
Login form

Author:
Leon Bachmann

2 years ago

11.4k
Form
form

Author:
Aman kumar

5 months ago

797
Login popup
with social media login buttons

Author:
Nikolai

9 months ago

2k
Simple Sign up form
A responsive simple singup or login form

Author:
Emdadul Islam

6 months ago

903

Explore components by Tags

Didn't find component you were looking for?

Search from 1800+ components