Sử dụng mẫu Gradient Borders CSS để khung viền màu sắc hơn

Gradient Borders CSS và ứng dụng

Dưới đây mình chia sẻ một số mẫu Gradient Borders CSS giúp cho khung viền của các nút bấm, khung màu sắc hơn. Về tính ứng dụng thì bạn có thể dùng mấy mẫu này để chèn vào bài viết, landing page, call to action,..

#01 Linear Gradient Border

Demo:

Giá trị

.ten-box {
     border: 3px solid;
     border-image-source: linear-gradient(to right, #f64f59, #c471ed, #12c2e9); 
     border-image-slice :1;
}

#02 Conic Gradient Border

Demo:

Giá trị:

.box {
border: 10px solid;
border-image-source: conic-gradient(red, orange, yellow, green, blue);
border-image-slice: 1;
}

Vẫn tiếp tục sưu tầm nhé anh em, anh em nào có mẫu đẹp thì để lại bình luận bên dưới để Tịnh Nguyễn tham khảo với ! Cảm ơn anh em !