login

html , css

This tailwind example is contributed by Hacker Development, on 08-May-2025. Component is made with Tailwind v3.4. 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

Tailwind v3.4 1.3k 2

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

Prashant

4 years ago

18.9k
Login form

Gopi Yadav

3 years ago

12k
Sign in / Login Form

Bunny

4 years ago

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

Ameth Galarcio

2 years ago

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

Ameth Galarcio

2 years ago

3.4k
Search input asasasas
sasasasasas

Notify ahmedabad

2 years ago

1.8k
Login Form
Login Form

Md. Tofayel islam

2 years ago

2.7k
Login Form
Login Form With google icon

Md. Tofayel islam

1 year ago

2.1k
Payment Form

ABDO-SY

1 year ago

2.4k
cards
html , css ,

Hacker Development

1 year ago

1.2k
login!!!!
html , css

Hacker Development

1 year ago

1.7k
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)

Ayyamperumal S

1 year ago

2.9k