Why are these TypeScript + JSX rather than just SVGs? It seems that the paths are defined as SVG but they are using some JavaScript framework to define the animations rather than just using SVG or CSS animations.
It’s jsx which is framework agnostic and used in several frameworks but most closely associated with react. It’s easy to convert to html but I guess the author is a react dev and also these icons use framer-motion which is a react animation library to animate the cursor hover. Looks like you can strip those out if you wanted to use these icons in html without animations.
Because they’re using events and downloading a few megabytes of extra javascript framework is, of course, a way better option than six lines of SVG stylesheets.
Why are these TypeScript + JSX rather than just SVGs? It seems that the paths are defined as SVG but they are using some JavaScript framework to define the animations rather than just using SVG or CSS animations.
It’s jsx which is framework agnostic and used in several frameworks but most closely associated with react. It’s easy to convert to html but I guess the author is a react dev and also these icons use framer-motion which is a react animation library to animate the cursor hover. Looks like you can strip those out if you wanted to use these icons in html without animations.
Because they’re using events and downloading a few megabytes of extra javascript framework is, of course, a way better option than six lines of SVG stylesheets.
Edit: forgot a /s