How to permanently add CSS to some pages using Firefox?

Say, I want to change the font or background of a page I frequent using Firefox.

How to do that?



  • Greasemonkey is a good option..
    – aneeshep
    Mar 14 '11 at 13:29

There's a great extension called Stylish that does exactly what you're looking for. It allows you to add custom CSS to the pages you visit.


You can add custom CSS rules to a chrome/userContent.css file in your Firefox profile folder.


/* For any page */
body { margin: 10px; border: 1px solid red !important; }

/* Or only for google.com */
@-moz-document domain(google.com) {
    body { margin: 10px; border: 1px solid red !important; }
  • 3
    Firefox restart needed for every change. Also, you can also use regular expressions to match an URL, for example: @-moz-document regex(".*\.(jpg|png|gif|bmp)$"). Which I used to make the image viewer of Firefox zoom in without blurring pixels (img{image-rendering: -moz-crisp-edges;image-rendering: pixelated;}).
    – Yeti
    Jul 17 '17 at 9:05
  • I did this now in 2019, still works when you don't want to find and install an extension.
    – Rennex
    Jun 4 '19 at 10:03

You can still use chrome/userContent.css in your profile folder but as of Firefox 69 and newer, you have to manually set toolkit.legacyUserProfileCustomizations.stylesheets to true in about:config to work.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.