Type Here to Get Search Results !

Gradient Border Generator

You May Also Like These Tools:

Create your own gradient border




Result

Output code:

.button-with-gradient-border { background-image: radial-gradient(circle at 100% 100%, transparent 9px, #d50000 9px, #d50000 10px, transparent 10px), linear-gradient(to right, #d50000, #304ffe), radial-gradient(circle at 0% 100%, transparent 9px, #304ffe 9px, #304ffe 10px, transparent 10px), linear-gradient(to bottom, #304ffe, #05ffde), radial-gradient(circle at 0% 0%, transparent 9px, #05ffde 9px, #05ffde 10px, transparent 10px), linear-gradient(to left, #05ffde, #ffd600), radial-gradient(circle at 100% 0%, transparent 9px, #ffd600 9px, #ffd600 10px, transparent 10px), linear-gradient(to top, #ffd600, #d50000) background-size: 10px 10px, calc(100% - 20px) 1px, 10px 10px, 1px calc(100% - 20px) background-position: top left,top center,top right,center right, bottom right,bottom center,bottom left,center left background-repeat: no-repeat }

Post a Comment

0 Comments
* Please Don't Spam Here. All the Comments are Reviewed by Admin.

Top Post Ad

Below Post Ad