e.g. black background, grey text. surely there must be a firefox extension for this?


Stylish is what you're looking for. There is a collection of pre-made styles at UserStyles.


You can change the default text and background colors in Firefox's preferences (the Content tab, then the Colors button). If you uncheck the checkbox in the Colors dialog, it will force these colors onto websites that define their own colors.

For specific websites (Gmail, for example) you can install the Greasemonkey extension which can dynamically change things like the colors on the page—given that you have a script written for that particular website.

  • 1
    Well, for Gmail, for that matter, you can just modify your theme in the settings. Much easier than greasemonkey - which is, no doubt, useful on a lot of other sites. – Rook Aug 30 '09 at 21:49
  • Yeah, that's true. I think you used to have to use Greasemonkey, though. – jgottula Aug 30 '09 at 22:34
  • I'd rather have one that tries to work universally rather than tweak scripts for each site. E.g. for this current site, the background is white, I'd rater have black bg with grey text. – bugmenot77 Aug 31 '09 at 11:28

This works for me.

javascript:(function(){var newSS, styles='* { background: #1A2424 ! important; 
color: cyan !important } :link, :link * { color: #66FF99 !important } 
:visited, :visited * { color: #9966CC !important }'; 
if( document.createStyleSheet) { 
document.createStyleSheet(%22javascript:'%22+styles+%22'%22); } else { 
newSS=document.createElement('link'); newSS.rel='stylesheet';
document.getElementsByTagName(%22head%22)[0].appendChild(newSS); } })();

(Formatted to remove horizontal scrolling. You can format to have it all on the one line.)

From Custom client-side CSS to change background colours at Ask.MeFi.


I made a stylish script that i sometimes use at night when white backgrounds are too dark. see if you like it.

@namespace url(http://www.w3.org/1999/xhtml);
*{  background:#000000 !important; 
    color:#CCCCCC !important;}
a {color:#FFCC66 !important;}
a:hover {   color:#FFFFCC !important;}
a:visited { color:#FFB720 !important;}

A better option than stylish is Blank Your Monitor It lets you switch between modes via a hotkey and it works better across more sites.

  • 1
    Some Stylish themes are enabled for all sites as well. Maybe an extension could do better using colour profiles or a graphics layer, but this one is just on par with a good userstyle. – Tobu Dec 1 '10 at 0:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy