Skip to content

Instantly share code, notes, and snippets.

@frontdevops

frontdevops/darkthemeswitcher-inline.js

Last active January 1, 2025 19:26
Show Gist options
  • Save frontdevops/8aea1e0252dd826488dad63319e3ec88 to your computer and use it in GitHub Desktop.
Save frontdevops/8aea1e0252dd826488dad63319e3ec88 to your computer and use it in GitHub Desktop.
Download ZIP
Simple Dark Theme Bookmarklet for web pages
Raw
darkthemeswitcher-inline.js
javascript:(d=>{var css=`:root{background-color:#fefefe;filter:invert(100%)}*{background-color:inherit}img:not([src*=".svg"]),video{filter: invert(100%)}`,style,id="dark-theme-snippet",ee=d.getElementById(id);if(null!=ee)ee.parentNode.removeChild(ee);else {style = d.createElement('style');style.type="text/css";style.id=id;if(style.styleSheet)style.styleSheet.cssText=css;else style.appendChild(d.createTextNode(css));(d.head||d.querySelector('head')).appendChild(style)}})(document)
Raw
darkthemeswitcher.js
javascript:
(d=>{
var css = `
:root{
background-color: #fefefe;
filter: invert(100%)
}
* {
background-color: inherit
}
img:not([src*=".svg"]), video{
filter: invert(100%)
}
`,
style,
id="dark-theme-snippet",
ee = d.getElementById(id);
if (null != ee) ee.parentNode.removeChild(ee);
else {
style = d.createElement('style');
style.type = "text/css";
style.id = id;
if (style.styleSheet) style.styleSheet.cssText = css;
else style.appendChild(d.createTextNode(css));
(d.head||d.querySelector('head')).appendChild(style);
}
})(document)
@lwcorp
Copy link

lwcorp commented Dec 17, 2022

I've forked it into a version that does not ruin iframes (like embedded YouTube) and images that use background-image= instead of <img.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment