Defining user styles
User styles have been around since the early days of the web. They are a way for users to specify their browsing preferences using CSS cascade. I remember way back when this option was fairly prominent in Internet Explorer settings. Now, I don't even know how to find it in most browsers. But I did find it in Firefox, and here's how you can too.
userContent.css
This is the file that you need to put in the right place and define your preferences. How to find the right place?
- In Firefox's menu go Help, then Troubleshooting Information
- Find "Profile Folder" open it
- In there create a directory called
chrome - Create the file in the
chromedir calleduserContent.css
Put something in it, like:
body {
background: blue !important;
}
Restart the browser and enjoy!
Chuckle at sites that don't have sensible defaults
WordPress:
Google:
Amazon:
ok, that's not totally fair, because these sites do define background color, but my !important wins. Still, some sites assume they have white background, but the background is often undefined.
Going further
Let's make youtube.com a lot less distracting. Add these to the user stylesheet:
ytd-app #guide,
ytd-app #page-manager ytd-browse,
ytd-app #secondary,
ytd-app #comments {
display: none !important;
}
Aaaand, no more silly comments, no more "related", no more "trending".
Ah, the power!
No extensions, no nothing. Just the Web, the way it was designed to be once upon a time.
If you know how to do this in Chrome, Safari or Edge, do let me know!