Replace all CSS on a page with new inline CSS


It can be useful when removing unused CSS to test out the new minimal CSS in browser console itself.

// Immediately focus on the webpage(e.g. click anywhere on the page) after running this code in console.
(function() {
        var style = document.createElement('style');
        // Sometimes the CSS can have octal sequences in it which can't be put inside template literals
        // So just copy from clipboard.
        // Assumes that the minimal CSS is already in clipboard. It would ask for a permission first time
        style.textContent = await window.navigator.clipboard.readText()
    }, 3000)

I recommend Used CSS chrome extension to get the minimal CSS for any web page.

... Loading comments