Created
October 15, 2025 23:38
-
-
Save soulhotel/c5b310cedab8f21f86f2fb015316ca1e to your computer and use it in GitHub Desktop.
Override the Solid Colors (wallpaper) section of the new tab page (firefox css)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @-moz-document url(about:newtab), url(about:home), url(about:privatebrowsing) { :root { | |
| /* when a custom or uploaded wallpaper is not in use, set this wallpaper (override default wallpaper) */ | |
| @media not -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper") { | |
| body {background-image: url("picture.jpg") !important;} | |
| } | |
| /* when a "Solid Color" wallpaper is set, use this wallpaper (override solid colors) */ | |
| @media (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","blue")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","light-green")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","green")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","dark-blue")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","dark-purple")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","dark-green")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","red")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","orange")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","beige")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","light-pink")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","light-blue")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","brown")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","light-purple")), | |
| (-moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","yellow")) { | |
| body { background-image: var(--uc-wallpaper) !important; } | |
| } | |
| /* when you select one of the solid color options, apply the custom wallpaper */ | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","blue") {--uc-wallpaper: url("1.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","light-green") {--uc-wallpaper: url("2.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","green") {--uc-wallpaper: url("3.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","dark-blue") {--uc-wallpaper: url("4.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","dark-purple") {--uc-wallpaper: url("5.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","dark-green") {--uc-wallpaper: url("6.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","red") {--uc-wallpaper: url("7.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","orange") {--uc-wallpaper: url("8.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","beige") {--uc-wallpaper: url("9.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","light-pink") {--uc-wallpaper: url("10.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","light-blue") {--uc-wallpaper: url("11.gif") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","brown") {--uc-wallpaper: url("12.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","light-purple") {--uc-wallpaper: url("13.jpg") !important;} | |
| @media -moz-pref("browser.newtabpage.activity-stream.newtabWallpapers.wallpaper","yellow") {--uc-wallpaper: url("14.jpg") !important;} | |
| /* match the custom wallpaper to the option image */ | |
| #blue {background-image: url("1.jpg") !important;} | |
| #light-green {background-image: url("2.jpg") !important;} | |
| #green {background-image: url("3.jpg") !important;} | |
| #dark-blue {background-image: url("4.jpg") !important;} | |
| #dark-purple {background-image: url("5.jpg") !important;} | |
| #dark-green {background-image: url("6.jpg") !important;} | |
| #red {background-image: url("7.jpg") !important;} | |
| #orange {background-image: url("8.jpg") !important;} | |
| #beige {background-image: url("9.jpg") !important;} | |
| #light-pink {background-image: url("10.jpg") !important;} | |
| #light-blue {background-image: url("11.gif") !important;} | |
| #brown {background-image: url("12.jpg") !important;} | |
| #light-purple {background-image: url("13.jpg") !important;} | |
| #yellow {background-image: url("14.jpg") !important;} | |
| /* replace the `Solid Colors` cover image */ | |
| #solid-colors[class*="wallpaper-input"] { | |
| background-image: url('picture.png'); | |
| } | |
| }} /*END*/ |
Author
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This is a modified snippet from ff ultima. By overriding the
Solid Colorsection of the New Tab pages menu, you can gain 14 free slots to use for your own rotation of custom wallpapers..There are basically two list for wallpapers in the menu:
Setting a custom wallpaper is as simply as changing one of these:
into this:
or into this (dedicated folder for organization):
line 65 for changing the Solid Color cover image:
Then you should have something like this:
ntpw.mp4