TARJETA DE CONEXIÓN

1,175 THEOPHANE

Abrir en el editor Publica tu código

Recomendado

13 June 2025

Un código de ashimadison8

10 February 2025

Un código de bachir123

30 November 2024

Arte de texto

HTML

CSS

body{
    background: linear-gradient(25deg,#8360c3,#2ebf91);

}
.image{
    border-radius: 50%;
    width: 140px;
    height: 140px;
    object-fit: cover;
    box-shadow: 0 4px 16px rgba(44, 62, 80, 0.2);
    margin-bottom: 15px;
    border: 4px solid #fff;

}
.lili{
    background: linear-gradient(25deg,#8360c3,#2ebf91);
       border: none;
    border-radius: 25px;
    padding: 30px 20px;
    margin: 40px auto;
    color: #fff;
    font-size: 20px;
    text-align: center;
    width: 350px;
    box-shadow: 0 8px 24px rgba(44, 62, 80, 0.2);
    transition: box-shadow 0.3s;
}
.i{   background: linear-gradient(90deg, #2ebf91, #8360c3);
    color: #fff;
    border: none;
    border-radius: 25px;
    padding: 12px 32px;
    font-size: 1.1rem;
    font-weight: bold;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(44, 62, 80, 0.15);
    margin-top: 18px;
    transition: background 0.3s, transform 0.2s;

}
.po{
     background: linear-gradient(90deg, #8360c3, #2ebf91);
    transform: scale(1.08);
    color: #fff;
        font-weight: bold;
    color: #2ebf91;
    margin-bottom: 10px;
    font-size: 1.3em;
}
@keyframes slideUpFadeIn {
    from {
        opacity: 0;
        transform: translateY(40px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
/* Ajout de l'animation à la classe .lili */
.lili {
    /* ...tes styles existants... */
    animation: slideUpFadeIn 1s ease;
}
@keyframes zoomRotateIn {
    from {
        opacity: 0;
        transform: scale(0.7) rotate(-10deg);
    }
    to {
        opacity: 1;
        transform: scale(1) rotate(0deg);
    }
}

.lili {
    /* ...tes styles existants... */
    animation: zoomRotateIn 1s cubic-bezier(0.23, 1, 0.32, 1);
}
@keyframes bounceIn {
    0% {
        opacity: 0;
        transform: scale(0.3);
    }
    50% {
        opacity: 1;
        transform: scale(1.05);
    }
    70% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }
}

.lili {
    /* ...tes styles existants... */
    animation: bounceIn 1s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}