Default Component - Copy this React, Tailwind Component to your project
"<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Sign Up</title> <link rel="stylesheet" href="signup.css"> <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet"> </head> <body> <div class="topbar"> <p>Summer Sale For All Swim Suits And Free Express Delivery - OFF 50% ! <a href="./homepage.html"><b>ShopNow</b></a> <select name="Language" id="Language"> <option value="English">English</option> <option value="Vietnamese">Vietnamese</option> <option value="Japanese">Japanese</option> </select> <button id="switch-mode"><i class="bi bi-moon-stars-fill"></i></button></p></p> </div> <div class="header"> <div class="Exclusive"> <h2>Exclusive</h2> </div> <div class="navigation"> <a href="homepage.html">Home</a> <a href="contact.html">Contact</a> <a href="about.html">About</a> <a href="signup.html">Sign Up</a> </div> <div class="search"> <input type="text" placeholder="What are you looking for?"> <img src="./Vector (3).png"/> </div> </div> <hr/> <div class="login"> <div class="left"> <div class="image"> <img src="./Side Image.png"/> </div> </div> <div class="right"> <h1>Create an account</h1> <p>Enter your details below</p> <div class="fill"> <div class="fill1"><input id="name" type="text" placeholder="Name"></div> <div class="fill2"><input id="email" type="text" placeholder="Email or Phone Number"></div> <div class="fill3"><input id="password" type="password" placeholder="Password"></div> </div> <div class="choose"> <button type="">Create Account</button> <button><img src="./google-icon.png" width="35px"/>Sign up with Google</button> </div> <div class="forget"> <p>Already have account? <a href="./login.html"><b>Log in</b></a></p> </div> </div> </div> <div class="Footer"> <div class="FooterTop"> <div class="Exclusive"> <div class="GroupText1"> <h2>Exclusive</h2> <h3>Subscribe</h3> <div class="text3">Get 10% off your first order</div> </div> <div class="Send"> <input type="text" placeholder="Enter your email"> <a href=""><img src="./Vector (4).png" alt=""></a> </div> </div> <div class="Support"> <h3>Support</h3> <div class="GroupText2"> <p>111 Bijoy sarani, Dhaka,<br>DH 1515, Bangladesh.</p> <p>exclusive@gmail.com</p> <p>+88015-88888-9999</p> </div> </div> <div class="Account"> <h3>Accout</h3> <div class="BtnAccount"> <a href="MyAccount.html">My Account</a> <a href="LogIn.html">Login/Register</a> <a href="Cart.html">Cart</a> <a href="">Wishlist</a> <a href="">Shop</a> </div> </div> <div class="QuickLink"> <h3>Quick Link</h3> <div class="BtnQuickLinks"> <a href="">Privacy Policy</a> <a href="">Terms Of Use</a> <a href="">FAQ</a> <a href="Contact.html">Contact</a> </div> </div> <div class="DownloadApp"> <div class="GroupDown"> <h3>Download App</h3> <div class="GroupText3"> <div class="textApp"> <p>Save $3 with App New User Only</p> </div> <div class="GroupImage"> <div class="Qrcode"><img src="./Qr Code.png" alt=""></div> <div class="ImageApp"> <a href="https://play.google.com/store/games?device=windows"><img src="./GooglePlay.png" alt=""> </a> <a href="https://www.apple.com/app-store/"><img src="./AppStore.png" alt=""></a> </div> </div> </div> </div> <div class="GroupIcon"> <a href="https://www.facebook.com/"><img src="./Icon-Facebook.png" alt=""></a> <a href="https://x.com/"><img src="./Icon-Twitter.png" alt=""></a> <a href="https://www.instagram.com/"><img src="./icon-instagram.png" alt=""></a> <a href="https://www.linkedin.com/"><img src="./Icon-Linkedin.png" alt=""></a> </div> </div> </div> <div class="FooterBottom"> <footer> <div class="copy"> <p>Copyright Rimel 2022. All right reserved</p> </div> </footer> <script src="./signup.js"></script> </body> </html>" dựa vào code html của tôi để hiểu rõ hơn