Useful tool for web developers

You could make an extension out of it

https://chrome.google.com/webstore/detail/tinyutils/mkfkbflfjahomeaenpcpnebogbamljep

Alternative

For credits of the original code, I actually can’t remember where I first found this… as it was like 3 years ago.

Bookmarklet

JavaScript
javascript: (function (){let domStyle=document.getElementById('domStylee');if(domStyle){document.body.removeChild(domStyle);return;} domStyle=document.createElement('style');domStyle.setAttribute('id','domStylee');domStyle.append(['* { color:#0f0!important;outline:solid #f00 1px!important; background-color: rgba(255,0,0,.2) !important; }'],['* * { background-color: rgba(0,255,0,.2) !important; }'],['* * * { background-color: rgba(0,0,255,.2) !important; }'],['* * * * { background-color: rgba(255,0,255,.2) !important; }'],['* * * * * { background-color: rgba(0,255,255,.2) !important; }'],['* * * * * * { background-color: rgba(255,255,0,.2) !important; }'],['* * * * * * * { background-color: rgba(255,0,0,.2) !important; }'],['* * * * * * * * { background-color: rgba(0,255,0,.2) !important; }'],['* * * * * * * * * { background-color: rgba(0,0,255,.2) !important; }'].join());document.body.appendChild(domStyle);})();

JavaScript
1	javascript: (function (){let domStyle=document.getElementById('domStylee');if(domStyle){document.body.removeChild(domStyle);return;} domStyle=document.createElement('style');domStyle.setAttribute('id','domStylee');domStyle.append(['* { color:#0f0!important;outline:solid #f00 1px!important; background-color: rgba(255,0,0,.2) !important; }'],['* * { background-color: rgba(0,255,0,.2) !important; }'],['* * * { background-color: rgba(0,0,255,.2) !important; }'],['* * * * { background-color: rgba(255,0,255,.2) !important; }'],['* * * * * { background-color: rgba(0,255,255,.2) !important; }'],['* * * * * * { background-color: rgba(255,255,0,.2) !important; }'],['* * * * * * * { background-color: rgba(255,0,0,.2) !important; }'],['* * * * * * * * { background-color: rgba(0,255,0,.2) !important; }'],['* * * * * * * * * { background-color: rgba(0,0,255,.2) !important; }'].join());document.body.appendChild(domStyle);})();

Full formatted code

JavaScript
function lol() {
    let domStyle = document.getElementById('domStylee');
    if (domStyle) {
        document.body.removeChild(domStyle);
        return;
    }
    domStyle = document.createElement('style');
    domStyle.setAttribute('id', 'domStylee');
    domStyle.append(
        ['* { color:#0f0!important;outline:solid #f00 1px!important; background-color: rgba(255,0,0,.2) !important; }'], /* red */
        ['* * { background-color: rgba(0,255,0,.2) !important; }'], /* green */
        ['* * * { background-color: rgba(0,0,255,.2) !important; }'], /* blue */
        ['* * * * { background-color: rgba(255,0,255,.2) !important; }'], /* fuschia */
        ['* * * * * { background-color: rgba(0,255,255,.2) !important; }'], /* cyan */
        ['* * * * * * { background-color: rgba(255,255,0,.2) !important; }'], /* yellow */
        ['* * * * * * * { background-color: rgba(255,0,0,.2) !important; }'], /* red */
        ['* * * * * * * * { background-color: rgba(0,255,0,.2) !important; }'], /* green */
        ['* * * * * * * * * { background-color: rgba(0,0,255,.2) !important; }'] /* blue */
        .join());
    document.body.appendChild(domStyle);
}

JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21	function lol() { let domStyle = document.getElementById('domStylee'); if (domStyle) { document.body.removeChild(domStyle); return; } domStyle = document.createElement('style'); domStyle.setAttribute('id', 'domStylee'); domStyle.append( ['* { color:#0f0!important;outline:solid #f00 1px!important; background-color: rgba(255,0,0,.2) !important; }'], /* red / [' * { background-color: rgba(0,255,0,.2) !important; }'], /* green / [' * * { background-color: rgba(0,0,255,.2) !important; }'], /* blue / [' * * * { background-color: rgba(255,0,255,.2) !important; }'], /* fuschia / [' * * * * { background-color: rgba(0,255,255,.2) !important; }'], /* cyan / [' * * * * * { background-color: rgba(255,255,0,.2) !important; }'], /* yellow / [' * * * * * * { background-color: rgba(255,0,0,.2) !important; }'], /* red / [' * * * * * * * { background-color: rgba(0,255,0,.2) !important; }'], /* green / [' * * * * * * * * { background-color: rgba(0,0,255,.2) !important; }'] /* blue */ .join()); document.body.appendChild(domStyle); }

Useful tool for web developers
- Alternative