#e8e8e8
HTML +TailwindCSS
1<section> 2 <div class="bg-white relative items-center w-full px-5 py-12 mx-auto md:px-12 lg:px-20 max-w-7xl"> 3 <div class="w-full max-w-md mx-auto md:max-w-sm md:px-0 md:w-96 sm:px-4"> 4 <div class="flex flex-col"> 5 <div> 6 <h2 class="text-4xl text-black">Reset password</h2> 7 </div> 8 </div> 9 <form> 10 <input value="https://jamstacker.studio/thankyou" type="hidden" name="_redirect"> 11 <div class="mt-4 space-y-6"> 12 <div class="col-span-full"> 13 <label class="block mb-3 text-sm font-medium text-gray-600"> Password </label> 14 <input type="password" placeholder="******" class="block w-full px-6 py-3 text-black bg-white border border-gray-200 rounded-full appearance-none placeholder:text-gray-400 focus:border-blue-500 focus:outline-none focus:ring-blue-500 sm:text-sm"> 15 </div> 16 <div class="col-span-full"> 17 <label class="block mb-3 text-sm font-medium text-gray-600"> Confirm passord </label> 18 <input type="password" placeholder="******" class="block w-full px-6 py-3 text-black bg-white border border-gray-200 rounded-full appearance-none placeholder:text-gray-400 focus:border-blue-500 focus:outline-none focus:ring-blue-500 sm:text-sm"> 19 </div> 20 21 <div class="col-span-full"> 22 <button type="submit" class="items-center justify-center w-full px-6 py-2.5 text-center text-white duration-200 bg-black border-2 border-black rounded-full nline-flex hover:bg-transparent hover:border-black hover:text-black focus:outline-none focus-visible:outline-black text-sm focus-visible:ring-black"> Submit your request </button> 23 </div> 24 </div> 25 </form> 26 </div> 27 </div> 28</section>
Variation of aform
Variation of aform