WEBLEB
होम
संपादक
लॉग इन करें
Pro
हिंदी
English
Français
Español
Português
Deutsch
Italiano
हिंदी
सीएसएस कार्ड चमक प्रभाव
879
kevekıbhack
संपादक में खोलें
Video
अपना कोड प्रकाशित करें
0
अनुशंसित
5 August 2025
कंपनी कार्ड सूची: HTML और CSS उदाहरण
30 March 2025
टेक्स्ट स्क्रैम्बल प्रभाव
21 July 2025
UNO कार्ड HTML CSS उदाहरण
HTML
Copy
Card Glow
CSS
Copy
@property --a { syntax: "<angle>"; initial-value: 0deg; inherits: false; } .card { overflow: hidden; position: relative; width: min(12.5em, 80vmin); aspect-ratio: 1; border-radius: 0.5em; place-self: center; place-content: center; padding: 0.5em; color: #ededed; font: clamp(1em, 2vw + 2vh, 2em) sans-serif; text-align: center; text-transform: uppercase; text-wrap: balance; } .card::before { position: absolute; z-index: -1; inset: -1em; border: solid 1.25em; border-image: conic-gradient(from var(--a), #7997e8, #f6d3ff) 1; filter: blur(0.75em); animation: a 4s linear infinite; content: ""; } @keyframes a { to { --a: 1turn ; } } html, body, div { display: grid; } html { min-height: 100%; } body { background-color: black; }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */