How to gradient a border, with CSS3?

The truth is that very cool to have a gradient border, at first I thought it was impossible but the fact is that there is a function in css called border-image. You create a transparent border first and give it the border-image option as follows:

border: 10px solid transparent; //You create the edge
border-image: linear-gradient(to bottom, #3acfd5 0%, #3a4ed5 100%) 1;
//add the gradient to the corners

And it is already that simple. Any questions you have, comment and I will gladly help you.

Comparte para enseñar a otros

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.