Opera GX Skin for Firefox
Steps to configure the theme:
chrome
👈 folder and the 👉user.js
👈 file into your Firefox profile directory. To find out the location of your profile directory go to about:support or about:profiles.
Notice:
⚠ The latest code updated in the repository (code > download zip) may work well only on beta or nightly versions.
You can use the "GX Theme Styles" Extension to a quick change of themes and colores, this extension works for solid themes only and for users that use the extra feature "Main-image". For change the new-tab background image and its accent-color you should do it manually like before. This extension was created by me.
Here a "Video Explanation" to how switch into light and dark mode for your web content.
You can also use the "Firefox Color" extension to change the accent color to your preference.
Into the "Extras" folder you will find the next features.
Various customizations
The file chrome/components/ogx_root-personal.css
contains very useful and easy to use variables, so it is easier to change:
Every variable has a description on the right, so you know what to customize without breaking the file.
NewTab Wallpaper
(Option 1) In the directory: chrome/newtab
there are 12 wallpapers (6 for dark theme and 6 for light theme), those images will display in the NewTab options for you to choose, you could rename the images you want with those names and the theme will display them, you can add your own images. You can find more images in: This Gallery.
(Option 2) Editing the code chrome/components/ogx_root-personal.css
lines from 18
to 31
. With this method you can change too the accent color for each wallpaper.
Other 'about' pages Wallpaper
For default the wallpaper selected is wallpaper-dark1.png
and wallpaper-light1.png
In the directory: chrome/newtab
, you could rename the image you want with those names and the theme will display them in those pages, you can change the names in the chrome/components/ogx_root-personal.css
file in the line 35
and the line 40
to the image you want.
Accent Color
Editing the code chrome/components/ogx_root-personal.css
lines from 18
to 31
you can change the accent color for each wallpaper for NewTab page. For the other pages (new-tab without wallpaper, preferences and add-ons pages) The chrome/components/ogx_root-personal.css
file has the variable: --general-color
to set the color, you could choose whatever you like. 💙💚💜🤎💛🧡❤ Restarting the browser is required.