Matrix es un directorio de páginas de inicio

1352 Metehan

Abrir en el editor Video Publica tu código

Matrix es un directorio de páginas de inicio

Recomendado

28 August 2025

Estudio de Diseño de Arquitectura: Diseño Moderno y Sostenible

24 May 2024

animaciones de tarjetas

10 January 2025

Un código de Mikeykun

HTML

CSS

body {

background-color: #f9e74d; /* Arka plan rengi */

background-image: repeating-linear-gradient(

45deg,

rgba(255, 255, 255, 0.3) 0%,

rgba(255, 255, 255, 0.3) 25%,

rgba(255, 255, 255, 0.5) 25%,

rgba(255, 255, 255, 0.5) 50%

); /* Matris deseni */

font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

display: flex;

justify-content: center;

align-items: center;

height: 100vh;

margin: 0;

}

.login-container {

background-color: white;

padding: 40px;

border-radius: 15px;

box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2);

text-align: center;

width: 350px;

}

h1 {

color: #333;

margin-bottom: 20px;

}

.input-group {

margin-bottom: 15px;

}

input[type="text"], input[type="password"] {

width: 100%;

padding: 10px;

border: 1px solid #ccc;

border-radius: 5px;

transition: border-color 0.3s;

}

input[type="text"]:focus, input[type="password"]:focus {

border-color: #f9d74d; /* Sarı ton */

outline: none;

}

button {

background-color: #f9e74d; /* Sarı ton */

border: none;

padding: 10px;

border-radius: 5px;

cursor: pointer;

font-size: 16px;

transition: background-color 0.3s;

}

button:hover {

background-color: #e6c72e; /* Daha koyu sarı */

}

#message {

color: red;

margin-top: 10px;

}

.footer {

margin-top: 20px;

}

.footer p {

color: #666;

}

.footer a {

color: #f9e74d;

text-decoration: none;

}

.footer a:hover {

text-decoration: underline;

}

Recomendado

Estudio de Diseño de Arquitectura: Diseño Moderno y Sostenible

animaciones de tarjetas

Un código de Mikeykun

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS