Измените белый фон на веб-страницах на другой цвет
В настоящее время я использую темную тему в Firefox. Это выглядит действительно хорошо, но многие веб-страницы используют простой белый фон. Получающийся контраст немного неприятен и иногда причиняет боль глазу, когда я переключаюсь с темной вкладки на белую вкладку.
Есть ли способ заставить firefox заменять белые фоны везде другим цветом (например, светло-серым)? Это может быть стильный скрипт, хак userChrome.css или все, что работает (желательно настолько легкое, насколько это возможно).
Чтобы прояснить ситуацию: после того, как я достигну своей цели, цвет фона при каждом посещении сайта Superuser должен быть светло-серым, а не белым, и то же самое должно случиться с любым другим сайтом с белым фоном (сайты Google, технический кризис и т. Д.).).
Есть способ сделать это?
16 ответов
Я только что написал быстрый скрипт Greasemonkey, который проверяет вычисленный стиль body
элемент и меняет его на черный (вы, вероятно, хотите выбрать другой цвет):
(function () {
if (window.getComputedStyle(document.body, null).getPropertyValue("background-color") == "rgb(255, 255, 255)") {
console.log("Setting new background color...");
document.body.setAttribute("style", "background-color: #000000;");
}
})();
Проблема с этими типами вещей состоит в том, что, если веб-сайты не разработаны очень хорошо, будут пятна белого на черном.
Это не идеальное решение, но вы можете делать это всякий раз, когда посещаете сайты, на которых хотите изменить фон.
В Firefox ниже 38, перейдите к Tools > Options > Content
и нажмите на Colours
кнопка. В Firefox 38 и выше перейдите к Edit > Preferences > Content
и там нажмите Colors
,
Выберите серый цвет для "Фона" и снимите флажки рядом с "Разрешить страницам выбирать свои собственные цвета вместо моих вариантов выбора выше" и "Использовать системные цвета".
Я обновил скрипт Greasemonkey (Firefox) для подавления белого фона.
Сценарии будут работать в Chrome, если вы установите Tampermonkey.
http://userscripts-mirror.org/scripts/show/142763
Это изменяет все белые фоны на серый (иш) с некоторой штриховкой. Вы можете настроить и установить свой собственный базовый цвет из общего кода. Оттенки белого также оказываются.
У меня есть три варианта: серый, розовый и зеленый - каждый из которых можно настроить.
Поиск в пользовательских скриптах для noWhiteBackgroundColor.
В строке поиска браузера введите about:config
,
В поле поиска введите browser.display.background_color
,
Дважды щелкните строку и измените #FFFFFF
(шестнадцатеричный код для белого) в #000000
(шестнадцатеричный код для черного) или любой другой цвет, который вы хотите, и нажмите кнопку ОК. Перезапустите браузер, чтобы он вступил в силу.
Я недавно обнаружил этот аддон Firefox Стильный. Это будет делать то, что вы хотите и многое другое!
Следующий Javascript переопределит фоновые элементы CSS и HTML белым и текстовые элементы черным на текущей странице, просто вставьте его в свое местоположение или поле браузера:
javascript:(function(){
var newSS,styles='* {background-color:black !important;color:white !important}
:link,:link *{color:#99C0EB !important}
:visited,:visited *{color:#C398EB !important}';
if(document.createStyleSheet){
document.createStyleSheet("javascript:'"+styles+"'");
}else{
newSS=document.createElement('link');
newSS.rel='stylesheet';
newSS.href='data:text/css,'+escape(styles);
document.getElementsByTagName("head")[0].appendChild(newSS);
}
})();
В строке URL введите about:config и перейдите к этому параметру: browser.display.background_color
Больше информации, если вам это нужно здесь.
Я недавно заменил свой старый компьютер, и мне нужно было снова установить Firefox. Одной из главных вещей, которые я хотел восстановить, был скрипт Greasemonkey, который изменял цвет фона любого веб-сайта.
Поэтому меня немного раздражало, что я не смог найти тот, который использовал раньше. Короче говоря - вот тот, что с моего старого ПК.
Этот сценарий не моя собственная работа
Вся заслуга должна идти к Говарду Смиту. Первоначально он был размещен на Userscripts.org, который сейчас недоступен.
Просто создайте новый пользовательский скрипт в Greasemonkey и вставьте следующее в:
(function () {
function noWhiteBackgroundColor() {
function changeBackgroundColor(x) { // Auto change colors too close to white
var backgroundColorRGB = window.getComputedStyle(x, null).backgroundColor; // Get background-color
if(backgroundColorRGB != "transparent") { // Convert hexadecimal color to RGB color to compare
var RGBValuesArray = backgroundColorRGB.match(/\d+/g); // Get RGB values
var red = RGBValuesArray[0];
var green = RGBValuesArray[1];
var blue = RGBValuesArray[2];
// ============================================================================
// Set the base colors you require:
// Use: http://www.colorpicker.com
// to find the RGB values of the base colour you wish to
// suppress white backgrounds with:
// Default gray provided:
// ============================================================================
var red_needed = 220;
var green_needed = 220;
var blue_needed = 255;
if (red>=220 && green>=220 && blue>=220) { // White range detection
if (red>=250 && red<=255 && green>=250 && green<=255 && blue>=250 && blue<=255) {
red_needed += 0;
green_needed += 0; }
else if (red>=240 && red<=255 && green>=240 && green<=255 && blue>=240 && blue<=255) {
red_needed += 6;
green_needed += 3; }
else if (red>=230 && red<=255 && green>=230 && green<=255 && blue>=230 && blue<=255) {
red_needed += 10;
green_needed += 5; }
else if (red>=220 && red<=255 && green>=220 && green<=255 && blue>=220 && blue<=255) {
red_needed += 14;
green_needed += 7; }
x.style.backgroundColor = "rgb( " + red_needed + ", " + green_needed + ", " + blue_needed + ")"; // The background-color you want
}
}
}
var allElements=document.getElementsByTagName("*"); // Get all elements on a page
for(var i=0; i<allElements.length; i++) {
changeBackgroundColor(allElements[i]);}
}
window.addEventListener("DOMContentLoaded",noWhiteBackgroundColor, false);
})();
Я использую это в течение почти двух лет и не могу вспомнить ни одного веб-сайта, который не смог изменить белый фон.
Я использую это.
Раскрасьте веб-страницы с помощью усовершенствованных элементов управления оттенком, насыщенностью, яркостью и непрозрачностью. Белый список веб-доменов для автоматической окраски (необязательно!).
НОВИНКА: используйте перетаскивание, чтобы копировать темы как текст и свободно группировать свойства цвета.
PS: плюс темная тема Firefox
https://addons.mozilla.org/en-US/firefox/addon/blank-your-monitor-easy-readin/
Я нашел это полезным. Это позволяет вам выбрать свой собственный цвет текста и фона. Просто нажмите горячую клавишу предопределено.
Установите расширение «Темный фон и светлый текст» в Firefox. Есть аналог для FF и Chrome, называется «Dark Reader».
https://addons.mozilla.org/en-US/firefox/addon/dark-background-light-text/https://addons.mozilla.org/en-US/firefox/addon/darkreader/
Нажмите на панель левой кнопкой мыши и настройте, и вы увидите зеленое дерево, поместите его в панель и нажмите на нее. Цвета изменятся, и вы все равно сможете создавать свои собственные цвета в пункте меню "Правка" -> "Настройки" -> "Содержимое" -> Цвета.
Отключить: использовать системные цвета и разрешить страницы
Хотя не совсем то, что вам нужно... Я использую часть программного обеспечения в сочетании с небольшим сценарием в OS X. Программное обеспечение называется Nocturne. Сценарий узнает, в какое время восход и заход солнца происходят в моем географическом местоположении. Затем он активирует Ноктюрн на закате и выключает его на рассвете. Я не знаю, что такое Firefox, но он, безусловно, хорош, так как работает в любом браузере и большинстве других программ.
https://github.com/darkreader/darkreader Darkreader в настоящее время (2023 г.) является предпочтительным плагином. Он имеет открытый исходный код и имеет более 1000 участников.
Затем, чтобы убедиться, что экран about:blank также черный, перейдите в about:config и измените браузер.display.background_color на #000000.
Затем в меню «Правка» -> «Настройки» -> «Общие» выберите «темную» тему, чтобы ваши страницы настроек также имели черный фон.
Затем в Инструментах разработчика в Firefox есть ... в правом верхнем углу, слева от закрывающегося X; нажмите на нее и выберите «темную» тему.
Надстройка http://addons.mozilla.org/en-US/firefox/addon/black-background-white-text имеет другой метод для черных цветов. Он инвертирует только цвета и фоновые изображения (инвертирование цветов не разрушит дизайн страницы, как в методах CSS или JavaScript). Вам понравится, вы чувствуете, что находитесь в белом режиме, и вам не нужно устанавливать какую-либо тему.
После установки измените метод по умолчанию с "простой CSS" на "инвертировать" в: меню Инструменты → Дополнения → Черный фон и белый текст → Метод изменения цвета страницы по умолчанию → Инвертировать.
NB. Если вы также изменили режим Windows на черный, то вам лучше отключить стандартное управление цветом Firefox и позволить надстройке выполнять всю работу, сделав это: меню Сервис → Параметры → Содержимое → Цвета → снимите флажок "Используйте системные цвета" и выберите "Никогда" в "Переопределить цвета, указанные на странице, с моими выборами выше".
Затем перезапустите Firefox!
Совет: Надстройка поместила кнопку на панели, чтобы отключить или изменить режимы с метода "инвертировать" на метод "CSS" или метод "JavaScript".
Вот результат:
Другой вариант - просто использовать кольцо топаза, чтобы изменить цвета фона или удалить заднюю часть.
Перейдя на сайт, введите URL-адрес веб-сайта и выберите наиболее удобную для вас комбинацию цвета фона / шрифта.