@SudhuCodes
Category - HTML & CSS
Uploaded At - 4/25/2025
1<!DOCTYPE html>2<html lang="en">34<head>5 <meta charset="UTF-8">6 <meta name="viewport" content="width=device-width, initial-scale=1.0">7 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">8 <link rel="stylesheet" href="style.css">9 <title>Modern Login Page | AsmrProg</title>10</head>1112<body>1314 <div class="container" id="container">15 <div class="form-container sign-up">16 <form>17 <h1>Create Account</h1>18 <div class="social-icons">19 <a href="#" class="icon"><i class="fa-brands fa-google-plus-g"></i></a>20 <a href="#" class="icon"><i class="fa-brands fa-facebook-f"></i></a>21 <a href="#" class="icon"><i class="fa-brands fa-github"></i></a>22 <a href="#" class="icon"><i class="fa-brands fa-linkedin-in"></i></a>23 </div>24 <span>or use your email for registeration</span>25 <input type="text" placeholder="Name">26 <input type="email" placeholder="Email">27 <input type="password" placeholder="Password">28 <button>Sign Up</button>29 </form>30 </div>31 <div class="form-container sign-in">32 <form>33 <h1>Sign In</h1>34 <div class="social-icons">35 <a href="#" class="icon"><i class="fa-brands fa-google-plus-g"></i></a>36 <a href="#" class="icon"><i class="fa-brands fa-facebook-f"></i></a>37 <a href="#" class="icon"><i class="fa-brands fa-github"></i></a>38 <a href="#" class="icon"><i class="fa-brands fa-linkedin-in"></i></a>39 </div>40 <span>or use your email password</span>41 <input type="email" placeholder="Email">42 <input type="password" placeholder="Password">43 <a href="#">Forget Your Password?</a>44 <button>Sign In</button>45 </form>46 </div>47 <div class="toggle-container">48 <div class="toggle">49 <div class="toggle-panel toggle-left">50 <h1>Welcome Back!</h1>51 <p>Enter your personal details to use all of site features</p>52 <button class="hidden" id="login">Sign In</button>53 </div>54 <div class="toggle-panel toggle-right">55 <h1>Hello, Friend!</h1>56 <p>Register with your personal details to use all of site features</p>57 <button class="hidden" id="register">Sign Up</button>58 </div>59 </div>60 </div>61 </div>6263 <script src="script.js"></script>64</body>6566</html>