Ana Tudor 🐯How would you code this with the following constraints:
✅ pure CSS
⚠️ under 10 declarations
⚠️ 1 element
❌ no pseudos
❌ no JS
⚠️ no SVG, no images in general save for at most 2 CSS gradients
Amelia Bellamy-Royds@anatudor It depends: Am I *trying* to turn my laptop into a portable electric heater, or no?
@AmeliaBR No. Not doing anything out of the ordinary with this demo. It has *extremely* limited support and even that support is barely since this week, but doesn't require much in terms of perf.
Noah Liebman@anatudor @AmeliaBR I feel like it’s repeating linear and conic gradients with blend mode difference for the xor. The thing I’m stuck on is moving the center of the radial gradient in a circle. You can’t move a gradient’s `at` based on an offset path or something (afaik). Are you animating custom props using trig functions or something?
For reference, 1st demo here, except animating the angle, not emulating circular motion with carefully chosen timing functions for x & y https://mastodon.social/@anatudor/109530871757375435