Style Firefox with Firefox Color version 2 - gHacks Tech News

Style Firefox with Firefox Color version 2

Mozilla released Firefox Color in early June 2018 to the public. The Test Pilot Experiment enables Firefox users to change the appearance of interface elements of the browser.

Firefox users needed to install the Firefox Color extension in the browser to get started. The configuration itself happens on the official Firefox Color website where users could select one of the preset themes or create a custom theme for the browser instead.

Theme creation was a matter of selecting one of the supported interface elements and a color or texture for that interface element. Firefox would be updated automatically to reflect the change, and users of Firefox Color could make the custom theme the default in the browser or share it with others.

Firefox Color version 2.0

firefox color version 2.0

Firefox Color was, and still is to a degree limited, when it comes to the elements that you may modify. Mozilla published an update recently that introduces new capabilities to Firefox Color.

First thing that you may notice is that the layout of the Firefox Color site changed. All interface elements that users can change are displayed in list form now underneath the preview area. Firefox users had to click on interface elements in the previous version to change those; now, with version 2.0 of Firefox Color, users select an interface element in the list to change the color.

The site highlights the element in the preview so that you know which interface element you will change. The new interface looks cleaner but it is not as easy anymore in the beginning to find the right interface element to change.

firefox theme

That's just temporary though and if you plan to change all elements, not a big issue.

The new version introduces new elements that you may change. There are the new popup background and popup text elements that you may customize after installing the new version. Popup refers to the menu that opens when you click on the main Firefox menu.

Firefox Color supported background patterns from the get-go but version 2.0 introduces an option to select your own pattern. Just click on "or add your own" button to select an image for the pattern that you have on your local device.

firefox color

Firefox Color supports jpg, png, and bmp images with a maximum size of 1 Megabyte. The images remain local and are not uploaded to the cloud according to the website.

You can save and share themes that you have created just like before and may notice the new random button at the top when you do. Random picks random colors for all interface elements.

As you can imaging, there is quite a range of possible outcomes. Many don't work too well, for instance those where the background color and text color are too close to each other so that text becomes difficult or even outright impossible to read. Others look quite nice.

Mozilla needs to work on the random feature a bit more. I suggest that it implements a routine to check for text readability and an option to pick a base color for the theme that the random theme is based on.

Closing Words

Firefox Color is a handy feature to customize the look and feel of the Firefox browser without installing themes uploaded to Mozilla AMO.

Firefox Color is still limited, especially when you compare it to the now-retired full themes that Firefox supported in the past. There is still work to be done; the right-click context menu displays in the default colors still even after installing Firefox Colors.

Now You: Do you run custom themes in your browser?

Summary
Style Firefox with Firefox Color version 2
Article Name
Style Firefox with Firefox Color version 2
Description
Mozilla published an update that introduces new capabilities to Firefox Color recently, a feature that enables Firefox users to theme Firefox.
Author
Publisher
Ghacks Technology News
Logo
Advertisement

We need your help

Advertising revenue is falling fast across the Internet, and independently-run sites like Ghacks are hit hardest by it. The advertising model in its current form is coming to an end, and we have to find other ways to continue operating this site.

We are committed to keeping our content free and independent, which means no paywalls, no sponsored posts, no annoying ad formats or subscription fees.

If you like our content, and would like to help, please consider making a contribution:


Previous Post: «
Next Post: »

Comments

  1. Anonymous said on October 3, 2018 at 9:48 am
    Reply

    The first thing I do immediately after an upgrade of Firefox Portable is to remove features of course included “Text Pilot Experiment”. I am not a stupid guinea pig.

    1. klaas said on October 3, 2018 at 2:59 pm
      Reply

      @Anonymous: how do you remove the “test pilot experiment”?

      1. Anonymous said on October 3, 2018 at 6:06 pm
        Reply

        del /S /Q “D:\PortableApps\FirefoxPortable\App\Firefox64\browser\features\*” + using Pants user.js

      2. Klaas Vaak said on October 4, 2018 at 7:31 am
        Reply

        @Anonymous: thank you. I also use Firefox portable, and the command worked well, except that for “screenshots” and “webcompat” I get “Access is denied” – do you get that too?

        The Panst user.js is a big file. Do you know which specific settings you use to delete or prevent features (getting) installed? If you don’t, no worries.

      3. Anonymous said on October 4, 2018 at 10:19 am
        Reply

        “except that for “screenshots” and “webcompat” I get “Access is denied” – do you get that too?”

        No, but I use a portable only 64 bit, not the full portableapps version which include the 32 bit also, may be that’s why? if you have both you have to delete the 32 bit features folder too : del /S /Q “D:\PortableApps\FirefoxPortable\App\Firefox\browser\features\*”

        “Do you know which specific settings you use to delete or prevent features (getting) installed?”

        To avoid headache I use the Pants user.js full and I update it with the “updater.bat”, I just made some modifications using the “user-overrides.js”. Have a look at the /*** 0500: SYSTEM ADD-ONS / EXPERIMENTS, probably there..

      4. Klaas Vaak said on October 4, 2018 at 12:45 pm
        Reply

        @Anonymous: many thanks for your input.
        Like you, I only have the 64-bit FF version installed. But with the /***0500 section of user.js I was able to block the 2 that denied access. /**0500 also has a few other settings I found interesting to adjust. Thanks again for your help.

      5. Anonymous said on October 4, 2018 at 10:29 am
        Reply

        …and FYI in “Options / General / Performance” I unchecked all boxes and turned “content process limit” to 1

      6. Klaas Vaak said on October 4, 2018 at 12:46 pm
        Reply

        @Anonymous: how does that help privacy? It is just about performance isn’t it?

      7. Anonymous said on October 4, 2018 at 4:16 pm
        Reply

        I said that because 1 can help limiting bugs about processes that could continue to run in background even with Firefox Portable closed, which could cause “Access is denied”?.

      8. Klaas Vaak said on October 4, 2018 at 5:51 pm
        Reply

        OK, clear, once again, many thanks for your help.

  2. Robert Ab said on October 3, 2018 at 10:10 am
    Reply

    I would be more happy if Mozilla could speed up work with missing APIs.

    1. Chronius said on October 3, 2018 at 12:46 pm
      Reply

      Nah, adding more useless stuff is more important.

  3. stilofilos said on October 3, 2018 at 11:20 am
    Reply

    No idea what bad spirits inhabit those browsers nowadays, but they are all becoming so terribly ugly that the need for such embellishments becomes more urgent by the day. Not my problem though, as I am sticking to FF39 and New Moon, and satisfied enough with how they look. But since that Google recently massacred video playback in them, I installed Vivaldi so that at least the granddaughters could keep viewing their youtube videos. Equally abominably ugly that one, too.
    I did use Nasa Night Launch in FF about a decade ago cos I prefered a dark theme at the time and it looked really nice, but I did not reinstall it at later occasions.
    And I do use css, but only to remove unwanted junk from websites, to make too small text more readable, and to reformat frequently visited websites that look made for phones so that they become less irritatingly narrow on a desktop – not for recolouring purposes.

    1. TelV said on October 3, 2018 at 2:20 pm
      Reply

      @stilofilos,

      You might want to try Waterfox. It supports both classic addons as well as WebExtensions. The dev is also working on creating WF’s own addons repository. https://blog.waterfoxproject.org/waterfox-56.2.3-release-download

      Try Legibility for the font size problem which I use myself: https://addons.mozilla.org/en-US/firefox/addon/text-legibility/?src=api

      1. stilofilos said on October 4, 2018 at 1:29 pm
        Reply

        @TelV,
        Thanks for the reply.
        I am actually aware of that, but last time I ckecked out Waterfox, it appeared to have a 64bits version only while my computer (the only working one these days) is still 32bits, the other one (64bits) is broken and will be replaced shortly , and then Waterfox will definitely be installed on it.
        About text sizes, multiple zoom things are available indeed, but I don’t need overall text being bigger, just sometimes in some elements, like menus or buttons e.g. in a few sites that are made for lower-resolution monitors than mine and so become unreadable while other elements are just fine, and that’s why I prefer css.

    2. John Fenderson said on October 3, 2018 at 5:40 pm
      Reply

      @stilofilos: “No idea what bad spirits inhabit those browsers nowadays”

      It’s not just browsers, it’s a vile trend across the entire software industry. Usability and aesthetics aren’t cool anymore, now it’s “minimalism” and ugliness. While it’s not the sole example, a great example of all this is Google’s “Material Design”.

      On the bright side, this has all the hallmarks of simply being the current fashion, and I expect that it will, eventually, pass.

  4. Weilan said on October 3, 2018 at 11:47 am
    Reply

    This is basically what Chrome and Vivaldi have… lame. Pretty lame.

    Firefox is so successfully copying Chrome in every way that after a while the only difference between them will be the name and icon.

    Just for the record, I’m not a fan of Chrome either, I was originally a Firefox fan around 2007 when Firefox was all the shit and nothing could stand on its pinky finger, even when it got bloated and slow, its add-ons are what kept it on top, then Chrome appeared with its sheer speed and responsiveness and it stole the cake, but now Firefox stripped its only trump card – the add-ons and is constantly becoming less and less customizable and it’s almost on Chrome’s level of lack of customization. Such a shame – a great browser has fallen to the bottom and competing with the garbage.

    1. yogaisevil said on October 3, 2018 at 10:17 pm
      Reply

      Last time I checked it was not possible to change the address bar color, every single theme has the blinding ‘white on black’ address bar regardless if it’s supposed to be a “dark theme”. Firefox as a definitive advantage here.

      1. Weilan said on October 4, 2018 at 11:36 am
        Reply

        @yogaisevil

        If that’s a joke I will laugh with you, if you’re serious I won’t laugh at you.

  5. Pedro said on October 3, 2018 at 12:40 pm
    Reply

    This is a lot better than the Personas web creator.

  6. Paul(us) said on October 3, 2018 at 1:48 pm
    Reply

    Thanks, Martin for letting me know.
    I really like one of the themes they offered with as an extra bonus now I have the active tab coloring. Quite handy I think personly! I also saved the theme that I have installed.
    Do you know next to the MozBackup how I can back up this theme (and others I have custom made for my self) separately (apart) on a backup disk in case I have to reinstall main o.s. or Firefox?

  7. frankell said on October 3, 2018 at 7:05 pm
    Reply

    for something similar but differrent check the freeware app “FFColorsCode” for the normal themes

    http://wiki.appvisor.org/FFStyled_ColorsCode

  8. yogaisevil said on October 3, 2018 at 10:03 pm
    Reply

    This is a good thing, who doesn’t want to easy customization in browser?

    In the case for ‘Dark theme’ users with more consistency, we have: https://github.com/overdodactyl/ShadowFox/

    As for scrollbars I use this “hack”: https://old.reddit.com/r/firefox/comments/7f6kc4/floating_scrollbar_finally_possible_in_firefox_57/ and the code provided here:
    https://old.reddit.com/r/firefox/comments/7f6kc4/floating_scrollbar_finally_possible_in_firefox_57/dqdbx6t/

    1. owl said on October 4, 2018 at 2:05 pm
      Reply

      @yogaisevil,
      Thanks to very useful information!
      Before Quantum, the “FT DeepDark” was my favorite. It will be an alternative to it.
      In combination with the “Dark Background and Light Text”, I was able to ideally improve the UI of DarkTheme.

  9. thebrowser said on October 3, 2018 at 11:36 pm
    Reply

    On the privacy side, I’d love to know if using this feature adds to the unique fingerprint of the browser and therefore making you more identifiable. Anyone?

  10. owl said on October 4, 2018 at 1:04 pm
    Reply

    @yogaisevil,
    Thanks to very useful information!
    Before Quantum, the “FT DeepDark” was my favorite. It will be an alternative to it.
    In combination with the “Dark Background and Light Text”, I was able to ideally improve the UI of DarkTheme.

  11. Laurent Paris said on October 4, 2018 at 6:41 pm
    Reply

    It’s a start, I suppose, but the UI is still flat and ugly. No gradients, no text shadows or highlights, no alternative tabs or icons… we’re still very far from Custom Theme Restorer and other legacy extensions.

    It’s obvious customization and powerful add-ons aren’t a priority for Mozilla. The necessary APIs aren’t coming anytime soon and the disgruntled extension devs probably won’t be back either. Thankfully Waterfox supports all my add-ons.

    1. frankell said on October 4, 2018 at 8:52 pm
      Reply

      well you’ll be surprised to know that the UI customization is still alive !
      check Firefox Quantum +FFStyled

      https://byfrankell.webnode.com/

      1. Money said on October 5, 2018 at 6:27 pm
        Reply

        @frankell Not for too long: https://bugzilla.mozilla.org/show_bug.cgi?id=1416044

        Mozilla Corporation doesn’t want users deviating from their holy “Photon” UI.

      2. frankell said on October 6, 2018 at 7:51 am
        Reply

        yeah that’s why 1 year ago I started my independent project “FFStyled” !

      3. Anonymous said on October 6, 2018 at 3:55 pm
        Reply

        1- I hate .exe
        2- I can’t even find the download link..?
        3-.. so I can’t verify if it is capable to find my FF portable profile?
        4- “many of them orphaned by the legacy addon Stylish”.. ??

      4. frankell said on October 6, 2018 at 10:35 pm
        Reply

        4 – https://userstyles.org/users/176916
        3 – during the setup browse to > FF portable \ Data \ profile
        2 – start with the free ColorsCode> http://wiki.appvisor.org/FFStyled_ColorsCode
        then if you are interested please contact me by mail
        1 – actually in the early version I used .bat files

  12. John said on October 25, 2018 at 7:27 pm
    Reply

    I can see why Chrome became popular, it was minimalist, fast, and apparently what most users wanted. With Quantum I thought maybe Firefox was back on track but again it just keeps piling on features trying to be relevant. The next big browser will probably be like Chrome originally was with a whole lot less Google influence.

Leave a Reply

Check the box to consent to your data being stored in line with the guidelines set out in our privacy policy

Please note that your comment may not appear immediately after you post it.