How can I preview PDFs with Google Chrome in dark mode?

How can I preview PDFs with Google Chrome in dark mode / reverse color?

By default it is white colored:

Followed-up by my asking How can I change the grey background of the PDF preview in Google Chrome to black?.

2 Answers

The following snippet adds a div overlay to any browser tab currently displaying a PDF document.

1. Open up your browser's Dev tools then browser console.

2. Paste this JavaScript code in your browser console:

const overlay = document.createElement("div");
const css = ` position: fixed; pointer-events: none; top: 0; left: 0; width: 100vw; height: 100vh; background-color: white; mix-blend-mode: difference; z-index: 1;
`
overlay.setAttribute("style", css);
document.body.appendChild(overlay);

3. Hit Enter

Special thanks:

You can use the Dark Reader Google Chrome extension and used the Filter+ mode. It will work on the online PDF files, but not at the local PDF files.