WEBLEB
Início
Editor
Entrar
Pro
Português
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Modelo de página de login HTML
872
alejandrokundrah
Abrir no Editor
Publique Seu Código
Recomendado
17 December 2024
Terminal de hack
13 June 2025
Um Código de Metehan
23 September 2024
Empresa local de vendas de produtos
HTML
Copy
Login Page
Welcome
Sign In
Forgot Password?
Sign Up
CSS
Copy
* { margin: 0; padding: 0; box-sizing: border-box; font-family: Arial, sans-serif; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #f0f0f0; } .container { width: 100%; display: flex; justify-content: center; align-items: center; } .login-box { width: 350px; padding: 40px; background-color: #f0f0f0; border-radius: 20px; box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.1), -10px -10px 20px rgba(255, 255, 255, 0.9); } .login-box h2 { text-align: center; color: #333; margin-bottom: 30px; } .input-group { position: relative; margin-bottom: 25px; } .input-group input { width: 100%; padding: 15px; border: none; background-color: #f0f0f0; border-radius: 10px; box-shadow: inset 3px 3px 6px rgba(0, 0, 0, 0.1), inset -3px -3px 6px rgba(255, 255, 255, 0.9); outline: none; color: #333; } .input-group input::placeholder { color: #999; } button { width: 100%; padding: 15px; border: none; background-color: #4CAF50; color: white; border-radius: 10px; cursor: pointer; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1), -5px -5px 10px rgba(255, 255, 255, 0.9); transition: all 0.3s ease; } button:hover { background-color: #45a049; } button:active { box-shadow: inset 3px 3px 6px rgba(0, 0, 0, 0.1), inset -3px -3px 6px rgba(255, 255, 255, 0.9); } .links { display: flex; justify-content: space-between; margin-top: 20px; } .links a { color: #333; text-decoration: none; font-size: 14px; } .links a:hover { text-decoration: underline; }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */