by Charles Cherry
Here is an awesome tip for those who use Chrome’s developer tools.
The Chrome devtools themselves are built out of HTML and CSS so I started digging for how I could edit the stylesheet. You can view the default devtool stylesheet by navigating to chrome-devtools://devtools/devTools.css. You can’t easily edit this though (it’s probably buried as a resource within Chrome), but you can override its styles using the standard custom user stylesheet Custom.css!
Custom.css lives at:
- Windows: C:\Users\<user>\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets
- Mac OS X: ~/Library/Application Support/Google/Chrome/Default/User Stylesheets/
The style(s) to add and override in Custom.css are:
A nice touch is that the styles update automatically as you save Custom.css so you can tweak it on the fly to get the right font-size for your audience.
View original post 3 more words