Settings

Theme

Stylebot for Firefox – Apply custom CSS on webpages

addons.mozilla.org

76 points by _ankit_ 5 years ago · 17 comments

Reader

petepete 5 years ago

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 5 years ago

    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 5 years ago

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

      • markussss 5 years ago

        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 5 years ago

        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 5 years ago

        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 5 years ago

    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 5 years ago

    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 5 years ago

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

baal80spam 5 years ago

Just use Stylus.

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

  • the_pwner224 5 years ago

    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 5 years ago

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

8bitsrule 5 years ago

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 5 years ago

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 5 years ago

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

tomaszs 5 years ago

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