DEV Community

Cover image for UI Components: How to make Outline Gradient Button with Transparent Background🤷‍♂️
Muhammad Ridho Anshory
Muhammad Ridho Anshory

Posted on

UI Components: How to make Outline Gradient Button with Transparent Background🤷‍♂️

During developing 🧑‍💻 website’s at my workplace, I was facing some difficulty when it comes to outlining some div or button with gradient color. After hours crawling on google, I find the solutions..

I wanted to share my thought about it and maybe you guys have another different approach to really save our time ⏰ solving the issues.

Goal🎯

So, on this article the goal 🎯 was making an Outlined Gradient Button with Transparent Background aka with opacity

OutlinedGradientButton

here’s the spell 🧙‍♂️ what is it look like in CodePen ✍️

If you guys have another thoughts leave a comment I'll update the post base on your solutions as well.. cheers🍻

Discussion (0)