How to change appearance of tabs for better accessibility
Hello. I'm a long-time Firefox user but this is the first time I have posted here.
I just changed my OS (I'm now on MX Linux 19) and I assume the version of Firefox I now have (91.0 64 bit) is newer than the one I was using. (I was on ubuntu 16.04)
The appearance has changed in a way that has reduced accessibility for me. When the active tab is the first or last tab, I get confused and think that the active tab is actually the adjacent one. It is only a few seconds of confusion but it keeps throwing me off.
I've realised why this is. The active tab is now a floating box. It is not attached in any way to the area below. All the other tabs *do* look like they are connected to the area below but they do not have any visible borders, except for the tab next to the active tab.
I tried a few different themes and I found that some that break this new convention (yay!) but the text/background contrast was lower and made reading difficult. (I can read black text on white background easily but find many other colour combinations difficult.)
I'm now using a theme that sticks with the new convention but makes the active tab yellow while other tabs are mid blue, which makes the active tab very obvious. I can read the text fairly well but it's not as good as black on white for me: https://addons.mozilla.org/en-GB/firefox/addon/high-contrast-color/
I read in a stack-exchange question that installing the Firefox Color extension would allow me to have more control over appearance. Unfortunately, I don't seem to be able to change just one thing, e.g. just change the colour of the active tab in the system theme. Instead, as soon as I change one thing, Firefox Color changes the colours of everything else that it has control over.
Is there a way to make the active tab more prominent without taking on a completely new colour scheme and without having to do any coding?
Thanks for any help.
All Replies (1)
Coding need not be difficult. https://www.userchrome.org/how-create-userchrome-css.html