In CSS you can set the cursor to a custom image, but a GIF will not animate.

From what I can tell it's commonly believed that to animate the cursor you need to use JS to create a fake cursor element, or split the animation into frames and animate them manually with CSS.

But this cursor image can be an SVG, so it should be possible to animate SVG properties with CSS.

It might also be possible to include a GIF as a foreignObject from within a cursor SVG.

Let's find out if that's possible, since I don't know.

I didn't implement code blocks or raw blocks yet for the blog unfortunately.

It doesn't work.

I guess the SVG gets immediately rasterised and doesn't animate for the same reason the GIF doesn't animate.

Even if I make an SVG with inline CSS that animates on its own as a data URL, it doesn't animate as a cursor.