4

I'm trying to completely replace the CSS for a domain with different CSS (i.e. swap out the CSS at gaming.SE for that of Stack Overflow). I'd ideally like an extension that lets me do this. I've used Personalized Web, which allows loading in CSS for a given domain, but it still loads the original CSS (you can specify CSS to ignore, but you have to do this rule by rule!

Does anyone know of a way of doing this?

fredley
  • 3,457

3 Answers3

6

Using the WebDeveloper extension, you can do exactly that!

Once installed, open the extension, hit the CSS tab and choose "edit css". you can then override every loaded CSS for that webpage.

Hope this helps!

-EDIT- For persistent changes, you can try Stylebot. They say "Stylebot is a Google Chrome extension that allows you to quickly create and save persistent custom CSS for sites".

2

With LiveStyle you have real time css reloading on save (SublimeText extension), you can associate remote css styles with local ones and even add extra css files to overwrite remote styles.

Edit: I settled on CSSInject extension - LiveStyle seems to reset css changes on refresh, so I'm keeping it only for live editing. If you need CSSInject to remove a style, add this code at line 49 in loadcss.js

for(var elem in document.getElementsByTagName("link") ) { 
   var node = document.getElementsByTagName("link")[elem];
   if(node.getAttribute("href") == "/path/to/css-style/to-remove.css") {       
     node && node.parentNode.removeChild(node);
  } 
}
1

Sounds like you are looking for a usercss extension of some kind, try something like stylish https://chrome.google.com/webstore/detail/fjnbnpbmkenffdnngjfgmeleoegfcffe, or alternatively chrome stylist https://chrome.google.com/webstore/detail/pabfempgigicdjjlccdgnbmeggkbjdhd?hc=search&hcp=main