'How can I customize user's current website cursor with my Chrome Extension using Vanilla JS?

I'm developing this Chrome Extension for Custom Cursors, I have the SVG path that I want to apply to the website's files that the user is using.

  1. What can I write in my JS code that can go through these files and apply that SVG for cursor?

  2. How could I link a an SVG path produced in my JS to a CSS file? (since the path is for applicable in HTML and not CSS) e.g. This is what I got: <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M91.224,45.5h-6.83c-1.09,0-2.116,0.273-3.019,0.748c-0.903-0.476-1.929-0.748- ........

  3. Any permissions required other than "Access to all sites" in the manifest.json?

javascriptcsssvggoogle-chrome-extensioncustom-cursor


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions