कुशल फ़ंक्शन 480 द्वारा एक कोड

1158 efficientfunction480

संपादक में खोलें अपना कोड प्रकाशित करें

अनुशंसित

26 December 2024

कुशलक्लाउड646 द्वारा एक कोड

10 February 2025

bachir123 द्वारा एक कोड

26 April 2025

लेब्रोनपॉलसुअरेज़ द्वारा एक कोड

HTML

CSS

/* Replace with your CSS Code 
(Leave empty if not needed) */

margin: 0;

padding: 0;

box-sizing: border-box;

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

}

body{

display: flex;

align-items: center;

justify-content: center;

height: 100vh;

background: #24232a;

}

.container{

position: relative;

width: 380px;

height: 420px;

background: #030013;

border-radius: 8px;

overflow: hidden;

}

.container::before{

content: "";

position: absolute;

width: 380px;

height: 420px;

background: linear-gradient(0deg, transparent, #fe03f6, #fe03f6);

top: -50%;

left: -50%;

transform-origin: bottom right;

animation: anime 7s linear infinite;

}

.container::after{

content: "";

position: absolute;

width: 380px;

height: 420px;

background: linear-gradient(0deg, transparent, #2376f5, #2376f5);

top: -50%;

left: -50%;

transform-origin: bottom right;

animation: anime 7s linear infinite;

animation-delay: 3s;

}

@keyframes anime{

100% {

transform: rotate(360deg);

}

.form{

position: absolute;

inset: 3px;

background: #24232a;

border-radius: 8px;

z-index: 10;

padding: 50px 40px;

display: flex;

flex-direction: column;

}

.form h2{

text-align: center;

color: #fe03f6;

letter-spacing: 3px;

}

.box{

position: relative;

width: 300px;

margin-top: 35px;

}

.box input{

width: 100%;

padding: 20px 10px 10px;

border-color: #fe03f6;

background: transparent;

border-top: none;

border-left: none;

border-right: none;

font-size: 18px;

outline: none;

color: #fe03f6;

}

अनुशंसित

कुशलक्लाउड646 द्वारा एक कोड

bachir123 द्वारा एक कोड

लेब्रोनपॉलसुअरेज़ द्वारा एक कोड

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS