Settings

Theme

Stylebot for Firefox – Apply custom CSS on webpages

addons.mozilla.org

76 points by _ankit_ · 17 comments

Reader

7 threads
petepete

I don't think you need an add-on for this if you're already handy with CSS, just edit userContent.css and use a domain-specific query:

    @-moz-document domain(https://news.ycombinator.com) {...}
  • markussss

    I find it incredibly useful to be able to toggle styles on and off in a simple GUI, especially for these two simple global styles:

        video { /* flip video horizontally */
            transform: scaleX(-1) !important;
        }
    
    or

        /** scale videos that were originally 4:3, but 
            were encoded as 16:9 into proper 4:3 again */
        video {
            transform: scaleX(0.75) !important;
        }
    
    It's not extremely useful, but every time I toggle them on, I'm very happy that I added them both.
    • the_pwner224

      Out of curiosity, what do you use the first flip horizontally style for?

      • markussss

        To flip videos that have been flipped, or for watching a video in the mirror. Maybe it's 1 in 100 videos, or even less, but it's so nice to be able to just toggle a button that flips the video properly.

      • bastawhiz

        Not OP, but there's a lot of unscrupulous videos out there that flip video horizontally to evade content matching algorithms, and plenty of videos taken on phones or web cams that get flipped as well

      • pvorb

        Most video call software will show your own webcam stream flipped horizontally to make it feel like a mirror, but others will see it correctly.

  • butz

    You can even customize browser UI using userChrome.css to revert new style of location bar or remove some items from context menus, and even more. This guide should give you some ideas: https://www.userchrome.org/what-is-userchrome-css.html

    For more inspiration and help visit https://www.reddit.com/r/FirefoxCSS/

  • OJFord

    I would do this so much more if it didn't require a restart of Firefox to take effect. As it is, I also use Stylus.

  • antman

    Did not know about that feature, I am impressed Mozilla has not blocked it in favor of some reason.

baal80spam

Just use Stylus.

https://addons.mozilla.org/en-US/firefox/addon/styl-us/

  • the_pwner224

    The first reaction to seeing this is of course 'why not use Stylus.' But it only takes a 10 second look at the page / screenshots to see that this clearly has a number of unique and new features that are beyond what Stylus offers. So no, you can't just use Stylus.

    My first impressions are that Stylus is nice for applying big site-wide styles like dark themes, but this is vastly superior for all the small customizations that you might want to make to sites you frequently visit. No need to go deep into the CSS; just right click a thing and open the sidebar and make it look how you want. Not even close to Stylus. Definitely something I'm going to keep, and makes for a very powerful combination paired with uBlock Origin's element picker/zapper.

MegaDeKay

Link to the Stylebot homepage: https://stylebot.dev/

8bitsrule

Nice. One page I visit daily had a nice dark background, and a bright-white glaring input form next to the text-panel that can't be dismissed. Not any more. Thanks!

throwawaybutwhy

Negative recent reviews in Chrome Store are a problem. I don't want to experiment with an extension if others have done so already and are unhappy as a result.

antibland

For custom CSS in Safari: Preferences => Advanced => Stylesheet dropdown

tomaszs

Is it actually working, I have tried some CSS extensions for Chrome and FF and they did not see to.

Keyboard Shortcuts

j
Next item
k
Previous item
o / Enter
Open selected item
?
Show this help
Esc
Close modal / clear selection