Firefox #

Warning: This post hasn't been updated for over a year. The information may be out of date.

Tricks #

• Hold optionon Mac, alt on Windows to select any word without opening the link.

Useful Add-Ons #

Moved to Browser extension.

Reference: All recommended extensions

Complete list: My add-on collection

Hidden Configuration Pages #

about:about         All hidden pages
about:config        Advanced settings
about:profiles      Profile manager
about:support       Detailed "about this browser"
about:debugging#/runtime/this-firefox
                    Load unsigned extension without changing setting

For example, to enable prefers-reduced-motion within the browser, add the following pair to about:config: (credit)

ui.prefersReducedMotion        true

or add the following to user.js:

// set prefers-reduced-motion
user_pref("ui.prefersReducedMotion", true);

Privacy-Focused Configurations #

References:

• The Firefox Privacy Guide For Dummies! – 12Bytes.org
• Firefox Privacy: A Guide to Better Browsing
• Firefox Profilemaker
• Most Common User Agents - Tech Blog (wh)

about:config #

Reference: Firefox: Privacy Related “about:config” Tweaks | PrivacyTools

Ones that I do not follow:

• dom.event.clipboardevents.enabled: Setting to False will disable Link Text and Location Copier, which I use daily.
• network.cookie.cookieBehavior: New versions of Firefox has default 4, which I think is good enough. Setting to 2 will stop Google from login (why?)

user.js #

Reference:

• GitHub - ghacksuserjs/ghacks-user.js: An ongoing comprehensive user.js template for configuring and hardening Firefox privacy, security and anti-fingerprinting
• GitHub - arkenfox/user.js: Firefox privacy, security and anti-tracking: a comprehensive user.js template for configuration and hardening

Browser CSS #

Ref: Tutorial: How to create and live-debug userChrome.css : r/FirefoxCSS

First, access about:config in Firefox, and enable toolkit.legacyUserProfileCustomizations.stylesheets option (set to true).

For macOS, the user profile folder is under: ~/Library/Application Support/Firefox/Profiles/, regardless of Firefox versions. If there are multiple profiles, access about:support in Firefox to see which is the current profile (opening this page may cause some Macs to make strange noises, just cope with it).

In the profile folder, create a folder and two CSS files with the following names:

.
└── chrome
    ├── userChrome.css
    └── userContent.css

White Outline for Favicon #

Solves this problem: how to fix firefox dark theme favicons issue? : r/firefox

You can see the difference very clearly with the Firefox default theme for macOS. Up is original, down is with my CSS: (with other tweaks)

In userChrome.css:

.tab-icon-image {
  filter: drop-shadow(1px 0 0 white) 
          drop-shadow(-1px 0 0 white) 
          drop-shadow(0 1px 0 white) 
          drop-shadow(0 -1px 0 white) !important;
}