A collection of home-made UserStyle CSS files, to be used with Stylus or other mechanism. UserStyles are used to modify the appearance (what you see) of a select few websites which I frequently use and would rather have a different design.

Use with the Stylus browser addon (for Firefox, for Chrome). Be cautious of similar-named addons as they’re often used to collect data without your consent. For an intoduction on how to use and experiment with Stylus (no need to be a programmer) see “Redesign Your Favorite Websites — Stylus Extension for FireFox or Chrome”.

These UserStyles may update automatically to accomodate for improvements and breaking changes, but they are primarily intented for my personal use, hence I am reluctant to changes that do not serve my use cases. You may use the Issue page to report any unintented behaviour (bugs) or breaks (usually when the website implements a major change) that you come accross.

Index

Click on “Install this style” to preview the CSS code and install directy if you already have Stylus enabled. All styles support automatic updates.

• Global styles
  • Hide dickbars — Hides “dickbars”, i.e. annoying CTAs and floating bars in several websites. Currently: facebook.com, instragram.com, twitter.com, newyorker.com.
  • Thin scrollbars — Applies thin scrollbars to all windows and elements. The colors are configurable. (Firefox only)
• UserChrome.css
  • tabs_to_bottom.userchrome.css — Moves the tab and URL bar to the bottom of the window.
• airtable.com
  • airtable.com dark theme — Dark theme for airtable.com. Beta quality, beware of 🐛.
  • airtable.com neat kanban — Modifies the display of Airtable’s Kanban view to make better use of available space and simplify the cards UI.

Global styles

Global or single-purpose styles that apply to multiple domains.

Hide dickbars

Hides “dickbars”, i.e. annoying CTAs and floating bars in several websites. Currently: facebook.com, instragram.com, twitter.com.

📦 Install this style

Thin scrollbars

Applies thin scrollbars to all windows and elements. The colors are configurable. (Firefox only)

📦 Install this style

UserChrome.css

Styles to modify the User Interface of Mozilla Firefox through UserChrome.css. Their installation is not as easy, and this feature is disabled by default.

1. Navigate to %APPDATA%\Mozilla\Firefox\Profiles (you can copy/paste this) or locate the exact directory by visiting about:profiles.
2. Create a folder named chrome then create a file named userChrome.css inside it and paste this code.
3. If userChrome.css doesn’t seem to work, open about:config and set toolkit.legacyUserProfileCustomizations.stylesheets=true.

tabs_to_bottom.userchrome.css

Moves the tab and URL bar to the bottom of the window. It’s where browser tabs should be by default in Windows, if proximity to the taskbar matters.

💾 See the code

airtable.com

airtable.com dark theme

Dark theme for airtable.com. Beta quality, beware of 🐛.

📦 Install this style

airtable.com neat kanban

Modifies the display of Airtable’s Kanban view to make better use of available space and simplify the cards UI. It also modifies a collaborator field with the configurable title “Action of”, if it exists.

📦 Install this style

© 2020 Heracles Papatheodorou a.k.a @Arty2, MIT Licence