Form by Javierrocadev
#e8e8e8
HTML +TailwindCSS
1<div id="login" class="w-64 h-80 bg-indigo-50 rounded shadow flex flex-col justify-between p-3"> 2 <form class="text-indigo-500" action="" method="post"> 3 <fieldset class="border-4 border-dotted border-indigo-500 p-5"> 4 <legend class="px-2 italic -mx-2">Welcome again!</legend> 5 <label class="text-xs font-bold after:content-['*'] after:text-red-400" for="email">Mail </label> 6 <input class="w-full p-2 mb-2 mt-1 outline-none ring-none focus:ring-2 focus:ring-indigo-500" type="email" required=""> 7 <label class="text-xs font-bold after:content-['*'] after:text-red-400" for="password">Password </label> 8 <input class="w-full p-2 mb-2 mt-1 outline-none ring-none focus:ring-2 focus:ring-indigo-500" type="password" required=""> 9 <a href="#" class="block text-right text-xs text-indigo-500 text-right mb-4">Forgot Password?</a> 10 <button class="w-full rounded bg-indigo-500 text-indigo-50 p-2 text-center font-bold hover:bg-indigo-400">Log In</button> 11 </fieldset> 12 </form> 13</div>
2.4K views
2.4K views
Variations
1 MIT License