Acceso

768 kevekıbhack

Abrir en el editor Publica tu código

Recomendado

9 September 2024

Galería de peces

28 June 2025

Plantilla HTML de página de error 404

30 March 2025

Un código de ytr3d3

HTML

<!DOCTYPE html>

<head>

<title>Legend Master Floating Login</title>

<style>

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700&display=swap');

body {

margin: 0;

padding: 0;

background: radial-gradient(circle at center, #0f0f0f 0%, #000000 100%);

font-family: 'Orbitron', sans-serif;

display: flex;

justify-content: center;

align-items: center;

height: 100vh;

overflow: hidden;

perspective: 1000px;

}

.floating {

animation: float 6s ease-in-out infinite;

}

@keyframes float {

0% {

transform: translateY(0px) rotateY(10deg) rotateX(5deg);

}

50% {

transform: translateY(-15px) rotateY(0deg) rotateX(0deg);

}

100% {

transform: translateY(0px) rotateY(10deg) rotateX(5deg);

}

.login-container {

background: rgba(255, 255, 255, 0.05);

border: 1px solid rgba(255, 255, 255, 0.2);

box-shadow:

0 0 30px #0ff,

0 0 60px #0ff inset,

0 20px 50px rgba(0, 255, 255, 0.3);

backdrop-filter: blur(15px);

border-radius: 20px;

padding: 40px;

width: 350px;

transform-style: preserve-3d;

transition: transform 0.6s ease;

}

.login-container:hover {

transform: scale(1.05);

box-shadow:

0 0 40px #0ff,

0 0 80px #0ff inset,

0 25px 60px rgba(0, 255, 255, 0.5);

}

.login-container legend {

font-size: 2.4em;

font-weight: 700;

color: #0ff;

text-align: center;

margin-bottom: 25px;

text-shadow: 0 0 10px #0ff, 0 0 20px #0ff;

}

.login-container input {

width: 100%;

padding: 15px;

margin: 12px 0;

border: none;

border-radius: 10px;

background: rgba(0, 0, 0, 0.7);

color: #0ff;

font-size: 1em;

box-shadow: inset 0 0 8px #0ff;

transition: box-shadow 0.3s ease, background 0.3s ease;

}

.login-container input:focus {

outline: none;

box-shadow: inset 0 0 15px #0ff, 0 0 10px #0ff;

background: rgba(0, 0, 0, 0.9);

}

.login-container button {

width: 100%;

padding: 15px;

border: none;

border-radius: 10px;

background: #0ff;

color: #000;

font-weight: 700;

font-size: 1.1em;

cursor: pointer;

transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;

box-shadow: 0 0 15px #0ff, 0 0 25px #0ff;

}

.login-container button:hover {

background: #00e6e6;

transform: scale(1.05);

box-shadow: 0 0 25px #0ff, 0 0 40px #0ff;

}

</style>

</head>

<body>

<legend>Legend Master Login</legend>

<button type="submit">Enter the Realm</button>

</fieldset>

</form>

</body>

</html>

Acceso

Recomendado

Galería de peces

Plantilla HTML de página de error 404

Un código de ytr3d3

HTML

CSS

JS

Recomendado

Galería de peces

Plantilla HTML de página de error 404

Un código de ytr3d3

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS