How to use custom css on web pages on the jolla browser?

Is there a way to override the page background and font colors in the sfos native browser?
To use custom css for all pages?
And if there is a way, can I use ambience colors and background, Theme.secondaryHighlightColor for instance?

You can write userstyles.

Create a directory ‘chrome’ in the profile directory:

Userstyles should go in a file called userContent.css (case-sensitive!).

You can include css that applies to all sites, e.g.

* color : black !important ;

or applicable to specific sites e.g.

@-moz-document url({
     body background-color : white !important ;

I don’t know about about ‘ambience colors…’ but essentially you can override the document’s own styles - though it can be tricky on dynamically-generated sites, like twitter.


There are a few variations of the @moz-document ‘site-specific stylesheet rule’. Quoting from dbaron’s mailing list post from 2004 (I still have it):

@-moz-document url(,
  /* CSS rules here apply to:
     + The page "".
     + Any page whose URL begins with ""
     + Any page whose URL's host is "" or ends with

There is also @-moz-document regexp() though I’ve never needed it. (You know the old joke about regular expressions):

userContent.css still works in Firefox to this day BTW - though it’s behind a pref from Fx69. And it’s easier to use an addon like Stylus, which works on Android (and Alien).

1 Like