Really cool eye catching animated border for cards, where you can adjust the colors, border size and speed.
Close
Really cool eye catching animated border for cards, where you can adjust the colors, border size and speed.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
selector{
--first-color: #ef32d9;
--second-color: #FFFF00;
--size: 100px;
--speed: 4s;
}
selector{
overflow: hidden !important;
display: flex;
justify-content: center;
align-items: center;
}
selector:before{
content: '';
position: absolute;
width: var(--size);
height: 140%;
background: linear-gradient(var(--first-color), var(--second-color));
animation: animate var(--speed) linear infinite;
}
@keyframes animate{
0%{
transform: rotate(0deg);
}
100%{
transform: rotate(360deg);
}
}
No Additional HTML Required