Gradient Border
Create a gradient border with CSS.
.card {
display: block;
width: 200px;
height: 200px;
padding: 1px;
background-clip: content-box, border-box;
background-image: linear-gradient(black, black), linear-gradient(to right, gray, gray);
}
.card:hover {
background-image: linear-gradient(black, black), linear-gradient(to right, red, red);
}