I've been following the CSS in-depth course by Estelle Weyl on Frontend Masters to learn much of this stuff. I recommend you go check out her work. The slides she use while teaching comes with a bunch of examples and playgrounds and are available on her website.
Mimicking a vinyl record
As a demo of a radial gradient I figured I wanted to make a CSS version of a vinyl record.
I started out with a simple radial gradient with just the main blocks of color.
Expanding on the simple version and making use of the ability to have multiple background images I made a version where a regular radial gradient is in charge of rendering the non-repeating parts of the record and a repeating radial gradient renders the body of the record with grooves.
The solution is pretty straight-forward, with one caveat: the element showing the gradient should be position: relative;. This lets you use the event.layerX and event.layerYproperties of the mousemove event.