Custom Glow Rings Inside of Elements
A box-shadow is an obvious choice for an inner glow of an element to highlight it. But with some fancy masking, we can use any overlay style we want.
A box-shadow is an obvious choice for an inner glow of an element to highlight it. But with some fancy masking, we can use any overlay style we want.
Certainly it isn’t the *only* way, but you’ve got a lot of angular control with conic-gradient() and it’s fun to work with.
We look at a couple of ways to essentially draw a little square dot in a slightly larger area and let it repeat, giving us a nice dotted background effect.
Using hard color stops with `repeating-conic-gradient()` and the double-stop syntax, we can pretty easily create a burst background. Then get fancier.
This article explores creating a typographic effect that “reveals” text in an interesting animated way.
Master.dev donates to open source projects through thanks.dev and Open Collective, as well as donates to non-profits like The Last Mile, Annie Canons, and Vets Who Code.