Caraes_Naur
KPCKevin Powell - Community
•Created by Caraes_Naur on 1/21/2025 in #front-end
Button Gradient Background State Transitions
I discovered @Kevin Powell's YouTube channel this past weekend and binged a bunch of videos. One of them gave me a hint about something I've been trying to achieve for a while: buttons with a gradient background that changes with element state (default/hover/active).
I made a CodePen to demonstrate: https://codepen.io/Caraes_Naur/pen/ByBOdKL
The Pen shows my current implementation using pseudo elements and an improved version using custom properties. It also describes the new approach's advantages and some remaining issues with it.
If this has been done before, I haven't seen it.
I just wanted to show this off and get some feedback & suggestions for improving it.
1 replies