Skip to content

Instantly share code, notes, and snippets.

@panzi
Last active June 26, 2018 17:53
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save panzi/9c0df97629fcbc6a57699f6fb10a0b36 to your computer and use it in GitHub Desktop.
Save panzi/9c0df97629fcbc6a57699f6fb10a0b36 to your computer and use it in GitHub Desktop.
Bookmarklet to invert colors on a page, but *not* of images and videos. Basically a quick dark-mode hack.
javascript:(function() {
function parseColor(str) {
var match = /^\s*(?:(?:#(?:([0-9a-f])([0-9a-f])([0-9a-f])|([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})))|rgb\(\s*([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)\s*\)|rgba\(\s*([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+(?:\.[0-9]*)?|\.[0-9]+)\s*\))\s*$/i.exec(str);
if (!match) throw new SyntaxError(str);
if (match[1]) {
return {
r: parseInt(match[1], 16) * 17,
g: parseInt(match[2], 16) * 17,
b: parseInt(match[3], 16) * 17,
a: 1.0
};
}
else if (match[4]) {
return {
r: parseInt(match[4], 16),
g: parseInt(match[5], 16),
b: parseInt(match[6], 16),
a: 1.0
};
}
else if (match[7]) {
return {
r: parseInt(match[7], 10),
g: parseInt(match[8], 10),
b: parseInt(match[9], 10),
a: 1.0
};
}
else if (match[10]) {
return {
r: parseInt(match[10], 10),
g: parseInt(match[11], 10),
b: parseInt(match[12], 10),
a: parseFloat(match[13]),
};
}
throw new SyntaxError(str);
}
var bg = getComputedStyle(document.body).backgroundColor;
if (bg) {
bg = parseColor(bg);
if (bg.a === 0.0) {
bg = getComputedStyle(document.documentElement).backgroundColor;
if (bg) {
bg = parseColor(bg);
if (bg.a === 0.0) {
bg.r = 255;
bg.g = 255;
bg.b = 255;
}
}
}
}
if (!bg) {
bg = {r:255, g:255, b:255};
}
document.body.style.backgroundColor = 'rgb(' + (255 - bg.r) + ',' + (255 - bg.g) + ',' + (255 - bg.b) + ')';
var filter = document.body.style.filter;
if (filter) {
filter += ',';
}
filter += 'invert(100%)';
document.body.style.filter = filter;
var style = document.createElement('style');
style.innerText = ':not(picture) > img,video,picture{filter:invert(100%) !important;}';
document.body.appendChild(style);
})();void(0)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment