WEBLEB
Início
Editor
Entrar
Pro
Português
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Um código por securearray494
1710
securearray494
Abrir no Editor
Publique Seu Código
Recomendado
29 December 2024
Uma página inicial alternativa
15 May 2025
Um código de Mete
21 April 2025
Um Código de Metehan
HTML
Copy
Login
Login
Forgot password?
CSS
Copy
* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Poppins', sans-serif; } body { display: flex; justify-content: center; align-items: center; height: 100vh; background: #151515; } .login-container { background: #1b1b1b; padding: 40px 35px 60px; border-radius: 5px; box-shadow: inset 0 0 1px #272727; width: 370px; } h3 { text-align: center; color: #c7c7c7; font-weight: 600; letter-spacing: 2px; margin-bottom: 30px; } .input-group { margin-top: 20px; position: relative; } .input-group label { position: absolute; top: 0; left: 0; padding: 10px 0; font-size: 16px; color: #fff; pointer-events: none; transition: 0.5s; } .input-group input { width: 100%; padding: 10px 0; font-size: 16px; color: #fff; margin-bottom: 30px; border: none; border-bottom: 1px solid #fff; outline: none; background: transparent; } .input-group input:focus { color: #339933; box-shadow: 0 0 5px rgba(0, 255, 0, 0.2), inset 0 0 5px rgba(0, 255, 0, 0.1); background: linear-gradient(#333933, #222922); animation: glow 0.8s ease-out infinite alternate; } .input-group input:focus ~ label, .input-group input:valid ~ label { top: -20px; left: 0; color: #03e9f4; font-size: 12px; } @keyframes glow { 0% { border-color: #339933; box-shadow: 0 0 5px rgba(0, 255, 0, 0.2), inset 0 0 5px rgba(0, 0, 0, 0.1); } 100% { border-color: #6f6; box-shadow: 0 0 20px rgba(0, 255, 0, 0.6), inset 0 0 10px rgba(0, 255, 0, 0.4); } } .actions { display: flex; flex-direction: column; align-items: center; } .actions button { width: 100%; padding: 10px; background: linear-gradient(#333, #222); color: #fff; border: none; border-radius: 5px; font-size: 16px; cursor: pointer; margin-top: 30px; letter-spacing: 1px; transition: 0.5s; } .actions button:hover { background: #03e9f4; color: #fff; border-radius: 5px; box-shadow: 0 0 5px #03e9f4, 0 0 25px #03e9f4, 0 0 50px #03e9f4, 0 0 100px #03e9f4; } .actions a { font-size: 12px; color: #03e9f4; text-decoration: none; margin-top: 25px; } .actions a:hover { text-decoration: underline; }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */