Skip to content

Instantly share code, notes, and snippets.

@rdillmanCN
Created December 30, 2017 09:20
Show Gist options
  • Save rdillmanCN/143cde7baaab040c492c8e0b622989fc to your computer and use it in GitHub Desktop.
Save rdillmanCN/143cde7baaab040c492c8e0b622989fc to your computer and use it in GitHub Desktop.
Find all colors used on the page and out put to the console.
(function() {
var h = {};
var e = ["background-color", "color", "border-top-color", "border-right-color", "border-bottom-color", "border-left-color"];
var g = {
"rgb(0, 0, 0)": 1,
"rgba(0, 0, 0, 0)": 1,
"rgb(255, 255, 255)": 1
};
[].forEach.call(document.querySelectorAll("*"), function(i) {
var j = {};
e.forEach(function(l) {
var k = window.getComputedStyle(i, null).getPropertyValue(l);
if (k && !g[k]) {
if (!h[k]) {
h[k] = {
count: 0,
nodes: []
}
}
if (!j[k]) {
h[k].count++;
h[k].nodes.push(i)
}
j[k] = true
}
})
});
var b = [];
for (var d in h) {
b.push({
key: d,
value: h[d]
})
}
b = b.sort(function(j, i) {
return i.value.count - j.value.count
});
var f = "font-weight:normal;";
var c = "font-weight:bold;";
var a = function(i) {
return "background:" + i + ";color:" + i + ";border:1px solid #333;"
};
console.group("CSS colors");
b.forEach(function(i) {
console.groupCollapsed("%c %c " + i.key + " %c(" + i.value.count + " times)", a(i.key), f, c);
i.value.nodes.forEach(function(j) {
console.log(j)
});
console.groupEnd()
});
console.groupEnd("CSS colors")
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment