login

html , css

This tailwind example is contributed by Hacker Development, on 08-May-2025. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are loading, loader,Register, Sign in,Front page

Input Spinner / Loading Login Form Landing Page

Author Hacker Development

Fork Fullscreen

<div class="flex h-screen bg-indigo-700">
  <div class="w-full max-w-xs m-auto bg-indigo-100 rounded p-5">
    <header>
      <img class="w-20 mx-auto mb-5" src="https://img.icons8.com/fluent/344/year-of-tiger.png" />
    </header>
    <form>
      <div>
        <label class="block mb-2 text-indigo-500" for="username">Username</label>
        <input class="w-full p-2 mb-6 text-indigo-700 border-b-2 border-indigo-500 outline-none focus:bg-gray-300" type="text" name="username" placeholder="write your username?">
      </div>
      <div>
        <label class="block mb-2 text-indigo-500" for="password">Password</label>
        <input class="w-full p-2 mb-6 text-indigo-700 border-b-2 border-indigo-500 outline-none focus:bg-gray-300" type="password" name="password" placeholder="write your Password?">
      </div>
      <div>
        <input class="w-full bg-indigo-700 hover:bg-pink-700 text-white font-bold py-2 px-4 mb-6 rounded" type="submit">
      </div>
    </form>
    <footer>
      <a class="text-indigo-700 hover:text-pink-700 text-sm float-left" href="#">Forgot Password?</a>
      <a class="text-indigo-700 hover:text-pink-700 text-sm float-right" href="#">Create Account</a>
    </footer>
  </div>
</div>

Related Examples

Login Form with Icon

Author:
Prashant

2 years ago

16.1k
Login form

Author:
Gopi Yadav

2 years ago

10.3k
Sign in / Login Form

Author:
Bunny

2 years ago

12.6k
Login
Login form, responsive, no dark-mode for white backgrounds, elegant for any platform

Author:
Ameth Galarcio

10 months ago

3.3k
Input Formulario
Input used in the form Link form: https://tailwindflex.com/@ameth1208/login

Author:
Ameth Galarcio

10 months ago

1.6k
Search input asasasas
sasasasasas

Author:
Notify ahmedabad

8 months ago

992
Login Form
Login Form

Author:
Md. Tofayel islam

8 months ago

1.5k
Login Form
Login Form With google icon

Author:
Md. Tofayel islam

3 months ago

844
Payment Form

Author:
ABDO-SY

2 months ago

505
cards
html , css ,

Author:
Hacker Development

1 week ago

57
login!!!!
html , css

Author:
Hacker Development

1 week ago

7
Clean AI Chat UI with Tailwind CSS – ChatGPT-Style Interface
A polished and responsive AI chat interface built using modern Web Components and Tailwind CSS. This UI replicates the smooth, minimal experience of ChatGPT with a clean layout, floating input bar, animated scrollable message feed, and mock AI responses. Ideal for SaaS dashboards, AI assistants, or frontend prototypes. Designed with professional spacing, accessible colors, and reusable components. Key features: Responsive layout with mobile support Floating input bar with auto-expanding textarea Tailwind-powered message bubbles with clear sender roles Modern dark theme with subtle gradients and shadows Easily extendable to real AI APIs (e.g., OpenAI)

Author:
Ayyamperumal S

1 week ago

132

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components