error: Content is protected !!
/* keeps the button on top of the glow */
.galactic-button {
z-index: 1;
}
/* css for the glowing effect */
.galactic-button:before {
content: '';
position: absolute;
z-index: -1;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border-radius: 50%;
pointer-events: none;
/* adjust the width and height keeping them both the same size */
width: 200px;
height: 200px;
/* adjust the colors here */
background: conic-gradient(from 0deg, #ff007f, #ffbf00, #00ffbf, #00d4ff, #ff007f);
/* adjust the speed of the animation */
animation: swirl 3s infinite linear;
/* adjust the blur */
filter: blur(50px);
/* adjust the opacity */
opacity: 0.5;
}
/* Swirl Animation */
@keyframes swirl {
0% {
transform: translate(-50%, -50%) rotate(0deg);
}
100% {
transform: translate(-50%, -50%) rotate(360deg);
}
}
