How to change font in Firefox Reader View?

Solution 1:

2019 answer:

If the Firefox Reader View can no longer be customized, you could use the alternative add-on Readability based Reader View, in order to "declutter webpages for better reading experience".

More information is to be found in its home page, from which I quote this text:

Q: Can I change the background color on the "Reader View" mode?

A: Yes, on the left side of the page, you will see a button with "Aa" label. Press this button once to open the UI control panel. You can change the font-family, font-size, line-height and the color of the page right from this panel. It is also possible to further customize each of the three provided modes by inserting your own user-defined custom styles. Use the options page to insert the CSS code.

Solution 2:

There's a detailed description to do this by adding a userContent.css in your user profile at How to Customize Firefox Reader View for Better Readability (Hongkiat blog). Also see this Reddit thread, I want to edit chrome://global/skin/aboutReader.css How do I do it?

...\Profiles\<your-profile-folder>\chrome\userContent.css

There is also How can I add the CSS styles used by Firefox reader mode? on the Mozilla support forum which says to modify #moz-reader-content in:

chrome://global/skin/aboutReaderControls.css
chrome://global/skin/aboutReaderContent.css 

...but is silent on how to do that.

Solution 3:

Here's a way to do it based on matt wilkie's answer, for Linux systems (it should be similar for Windows and MacOS*):

$ cd ~/.mozilla/firefox/*.default
$ mkdir -p chrome && cd chrome
$ echo 'body.serif { font-family: "URW Palladio L" !important; }' >> userContent.css

(I used the "URW Palladio L" font for demonstration, as it's the closest font commonly available on Linux systems to Book Antiqua / Palatino, which are my go-to choices for serif text.)

The !important is required because the userContent.css stylesheet is loaded before the reader ones.

_{* To find the profile folder, navigate to about:support (or use the menu Help > Troubleshooting Information) and click the "Open Directory" button next to the "Profile Directory" entry.}