WEBLEB
Início
Editor
Entrar
Pro
Português
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Efeito de brilho do cartão CSS
237
kevekıbhack
Abrir no Editor
Publique Seu Código
Recomendado
15 May 2025
Código de Mete
27 November 2024
gerador de citações
23 August 2025
Formulário de login HTML com alternância de senha
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) */