X
Tap here to go to the mobile version of the site.

Support Forum

night mode?

Posted

Is it possible to default firefox to the "night mode" -- i.e. black background and white/gray text?

If I manually set the background color to be black and the foreground color to be white, it often messes up webpages (e.g. new york times). I managed to achieve on a webpage-by-webpage basis using the following bookmarklet

javascript:(function(){N=document.createElement('link');S='*{background:black%20!important;color:lightgrey%20!important}:link,:link%20*{color:#ddddff%20!important}:visited,:visited%20*{color:#ddffdd%20!important}';N.rel='stylesheet';N.href='data:text/css,'+escape(S);document.getElementsByTagName('head')[0].appendChild(N)})()

but I need to redo this on every new page (e.g. if an article gets splitted into multiple pages). I would be great to be able to set this by default.

THANKS!

Is it possible to default firefox to the "night mode" -- i.e. black background and white/gray text? If I manually set the background color to be black and the foreground color to be white, it often messes up webpages (e.g. new york times). I managed to achieve on a webpage-by-webpage basis using the following bookmarklet javascript:(function(){N=document.createElement('link');S='*{background:black%20!important;color:lightgrey%20!important}:link,:link%20*{color:#ddddff%20!important}:visited,:visited%20*{color:#ddffdd%20!important}';N.rel='stylesheet';N.href='data:text/css,'+escape(S);document.getElementsByTagName('head')[0].appendChild(N)})() but I need to redo this on every new page (e.g. if an article gets splitted into multiple pages). I would be great to be able to set this by default. THANKS!

Additional System Details

Installed Plug-ins

  • Shockwave Flash 11.2 r202
  • The IcedTea-Web Plugin executes Java applets.
  • Google Talk Plugin Video Accelerator version:0.1.44.23
  • Version: 3.10.2.0
  • The Adobe Reader plugin is used to enable viewing of PDF and FDF files from within the browser.

Application

  • User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:18.0) Gecko/20100101 Firefox/18.0

More Information

jscher2000
  • Top 10 Contributor
3129 solutions 28792 answers

You can create default style rules for web pages by saving them in a new file named userContent.css or by creating a rule using the Stylish extension. Stylish is a bit easier to use for development because you do not have to restart Firefox to see the change. On the other hand, if you don't plan to write any other rules, userContent.css involves less overhead.

https://addons.mozilla.org/en-US/firefox/addon/stylish/

For tips on userContent.css, try searching for past threads here.

You can create default style rules for web pages by saving them in a new file named userContent.css or by creating a rule using the Stylish extension. Stylish is a bit easier to use for development because you do not have to restart Firefox to see the change. On the other hand, if you don't plan to write any other rules, userContent.css involves less overhead. https://addons.mozilla.org/en-US/firefox/addon/stylish/ For tips on userContent.css, try searching for past threads here.
cor-el
  • Top 10 Contributor
  • Moderator
12136 solutions 112749 answers

Add code to the userContent.css file.

The customization files userChrome.css (interface) and userContent.css (websites) are located in the chrome folder in the user profile folder.

I had a hard time with th link colors, so I changed them a bit:

*{background:black!important;color:lightgrey!important}
:link,:link *{color:#88f!important}
:visited,:visited *{color:#8f8!important}

javascript:(function(){N=document.createElement('link');S='*{background:black!important;color:lightgrey!important}:link,:link *{color:#88f!important}:visited,:visited *{color:#8f8!important}';N.rel='stylesheet';N.href='data:text/css,'+escape(S);document.head.appendChild(N)})()
Add code to the userContent.css file. *http://kb.mozillazine.org/userContent.css The customization files userChrome.css (interface) and userContent.css (websites) are located in the chrome folder in the user profile folder. *http://kb.mozillazine.org/Editing_configuration I had a hard time with th link colors, so I changed them a bit: <pre><nowiki>*{background:black!important;color:lightgrey!important} :link,:link *{color:#88f!important} :visited,:visited *{color:#8f8!important} </nowiki></pre> ---- <pre><nowiki>javascript:(function(){N=document.createElement('link');S='*{background:black!important;color:lightgrey!important}:link,:link *{color:#88f!important}:visited,:visited *{color:#8f8!important}';N.rel='stylesheet';N.href='data:text/css,'+escape(S);document.head.appendChild(N)})() </nowiki></pre>