Dark theme has grown to be fashionable these days.ĭark Reader is open source and was previously only available for Chrome.
Firefox dark reader windows#
It seems like people just prefer to view darker pages on these screens on just about anything, whether it is Windows OS, mobile apps, or web pages. Well, I do admit, dark theme is becoming a thing nowadays. The Dark Reader extension makes web page dark themed so that the ‘white’ on the pages does not hurt your eyes when you are viewing them at night.
![firefox dark reader firefox dark reader](https://img.youtube.com/vi/3bP6Dq5cF0o/maxresdefault.jpg)
![firefox dark reader firefox dark reader](https://www.ghacks.net/wp-content/uploads/2020/08/firefox-pdf-reader-dark.png)
Now, they have roped in another developer Alexander Shutov who is behind the Dark Reader extension for Chrome. One of the first big deal in terms of extension that users love so much on Chrome – and was making it extra harder for them to switch to Firefox – was the Speed Dial 2. However, since Mozilla rolled out the new design Firefox Quantum, the company has been working overtime to attract developers onto the Firefox extensions development team. :root body.Chrome is blessed with tones of extensions, something that cannot be said for its competition, not even its distant closest rival Firefox. You can use the following selectors for the different default options: In order to customize the design of the Reader View, you need to target the tag with the appropriate selectors.
Firefox dark reader code#
Once you’ve created and opened userContent.css in a code editor, it’s time to add your CSS rules. the Profile Folder buttonĬreate a folder called chrome inside your Profile Folder (if you don’t have it yet), and a file called userContent.css inside the chrome folder. Click the Show Folder button, and it will open your Profile folder. You’ll find yourself on a page that contains the technical data related to your Firefox install. To find your Firefox profile folder, type about:support into the URL bar and press Enter. You need to create a file called userContent.css inside the chrome folder of your Firefox profile folder for your Reader View customizations. You can check these out with the help of the Firefox Developer Tools by hitting F12. If you want to customize another theme variant (skin + font), you will need to use the appropriate CSS selectors.
![firefox dark reader firefox dark reader](https://techdows.com/wp-content/uploads/2015/05/Windows-10-build-10074-start-menu-and-taskbar-with-black-theme.png)
Firefox dark reader skin#
I use a dark skin with serif fonts, and this means that I will need to override the belonging CSS classes, in my case. You can customize the theme by overriding the CSS rules of these pre-existing options.
![firefox dark reader firefox dark reader](https://windows-cdn.softpedia.com/screenshots/AS-Dark-Reader_1.png)
Pre-Built Optionsįirefox Reader View comes with a few pre-built customization options such as dark, light and sepia backgrounds, adjustable font sizes, and serif and sans-serif typefaces. For demo purposes, I will be using an article by National Geographic article. We’ll be looking at those options before showing you what you can do to further personalize the look of the Reader View. There are a few built-in options that allow readers to customize the look of the Reader View. If the feature is available for a certain page, you will find the icon to enable it in the shape of a small book icon displayed to the right of the address bar. Reader View is, however not available, for all home pages. Reader View is a popular feature of the Firefox browser, that changes the appearance of a web page, and makes it more readable by removing visual clutter such as images, ads, headers, and sidebars.