Prototype is a Chrome extension to inject any hosted stylesheets (CSS) or Javascript (JS) file into any webpage.
After installing the extension from the Chrome Extension Gallery (or loading unpacked from source), right-click on the extension icon and select "Options".
Install the extension: https://chrome.google.com/webstore/detail/fdgdeaiajeafamlgajlpgbejadaegepj/
- Specify any hosted CSS or JS file to inject (local files must be hosted under
http://localhost/
- security restriction of Chrome) - It modifies HTTP headers for full prototyping power.
- You can use the extension for your own prototyping or for others to test your prototype.
- The extension saves your options even when you restart the browser or change the code.
Currently modified header policies:
- Disabled
Access-Control-Allow-Origin
andContent-Security-Policy
allow for injecting cross-origin scripts. - Explicitly enabled
Feature-Policy
modules allow to include device hardware. List of supported feature policies
Enter one of the following URLs into the options of the extension:
- Add a darkmode to your website: https://denbue.github.io/Prototype/demos/darkmode/
- Let it rain cats on your website: https://denbue.github.io/Prototype/demos/kitties/
- Ever wondered how comic sans would look on your website? https://denbue.github.io/Prototype/demos/comic/
A special thanks goes to sym3tri, the original creator of CSS-Inject
https://denbue.github.io/Prototype/demo/darkmode/