Envato Elements - pobieraj co chcesz, ile chcesz

Nie da się ukryć, że moda na czarne interfejsy użytkownika (dark mode) rozkręca się coraz bardziej, i wchodzi w kolejne segmenty. O ile w telefonie zazwyczaj sam chętnie korzystam, to na komputerze raczej sporadycznie – ustawiłem w sumie tylko Windowsa, Firefoxa i jakieś pojedyncze aplikacje w tryb ciemny. Ale to może dlatego, że z komputera wieczorami i w nocy korzystam rzadko, co zresztą uważam za jeden z moich większych sukcesów, jeśli chodzi o prace i rozrywkę. Tymczasem Google prezentuje w najnowszej wersji swojej przeglądarki Chrome tryb ciemny dla… wszystkich stron.

Force Dark Mode for Web contents w Google Chrome

Oczywiście nie jest to dla mnie niespodzianką, bo od dawna słychać było, że w Chrome ma pojawić się ustawienie, które pozwoli każdą stronę internetową automatycznie wyświetlić w trybie ciemnym (dark mode). Dziś jednak miałem okazję sprawdzić to na własnym komputerze.

W oficjalnej (stabilnej) wersji Chrome nie ma jeszcze takiej opcji, ale już np. w wersji Chrome Canary (wersja testowa) można aktywować tryb ciemny:

Opcja ta znajduje się w ustawieniach eksperymentalnych, do których można się dostać wpisując w pasku adresu:

chrome://flags

W tym momencie najszybciej skorzystać z wyszukiwarki, wpisując w niej „Force Dark Mode” (ew w wersji pełnej: Force Dark Mode for Web contents). Jak widać na grafice powyżej – do wyboru mamy kilka trybów modyfikowania stron:

  • Enabled (podstawowy tryb zamiany)
  • Enabled with simple HSL-based inverion
  • Enabled with simple CIELAB-based inverion
  • Enabled with selective image inversion
  • Enabled with selective inversion of non-image elements
  • Enabled with selective inversion of everything
  • Disabled (tryb standardowy, czyli bez zmiany)

Tak wygląda przykładowa podstrona Webiniser.pl:

A tak ta sama strona we wszystkich dostępnych wariantach:

Każdy chętny tryb raczej powinien wybrać pod siebie, ale moje krótkie testy wykazały, że najlepsze efekty (według mnie) dają 2 ostatnie tryby, czyli:

  • Enabled with selective inversion of non-image elements
  • Enabled with selective inversion of everything

Może nie jest idealnie, ale całkiem nieźle, zważywszy, że robi to automat.

Nie wiem, czy moda na ciemne motywy się utrzyma, i faktycznie cały internet ucieknie nam w ciemności (mam nadzieję, że jednak nie), ale jeśli faktycznie mamy bawić się w tryb ciemny na stronach internetowych, to może warto byłoby pomyśleć o wdrożeniu specjalnego znacznika dla pliku ze stylami dla trybu ciemnego, np:

<link rel="stylesheet-dark" href="styles-dark.css"> 

Zwłaszcza że już teraz często w takich przypadkach stosuje się np. JavaScript, by umożliwić zmianę motywu strony na ciemny. W takiej sytuacji (zdefiniowany plik stylów dla trybu ciemnego) chyba lepiej, gdyby przeglądarka sięgała po niego, zamiast samodzielnie dokonywać konwersji.

(!) Zgłoś błąd na stronie
Potrzebujesz profesjonalnej pomocy? Skontaktuj się z nami!
Spodobał Ci się artykuł? Zapisz się do naszego Newslettera - ZERO SPAMu, same konkrety, oraz dostęp do dodatkowych materiałów przeznaczonych dla subskrybentów!
Na podany adres e-mail otrzymasz od nas wiadomość e-mail, w której znajdziesz link do potwierdzenia subskrypcji naszego Newslettera. Dzięki temu mamy pewność, że nikt nie dodał Twojego adresu przez przypadek. Jeśli wiadomość nie przyjdzie w ciągu najbliższej godziny (zazwyczaj jest to maksymalnie kilka minut) sprawdź folder SPAM.

Patryk

CEO Webinsider.pl, a do tego CTO, CIO, CFO, CMO, CSO, COO i CRO ;-)
Pasjonat nowych technologii - od sprzętu po oprogramowanie, od serwerów po smartfony i rozwiązania IoT. Potencjalnie kiepski bloger, bo nie robi zdjęć "talerza" zanim zacznie jeść.

Dumny przyjaciel swoich psów :-)
Envato Elements - pobieraj co chcesz, ile chcesz
Napisz komentarz
wipl_napisz-komentarz_01Jeśli informacje zawarte na tej stronie okazały się pomocne, możesz nam podziękować zostawiając poniżej swój komentarz.

W tej formie możesz również zadać dodatkowe pytania dotyczące wpisu, na które – w miarę możliwości – spróbujemy Ci odpowiedzieć.
Linki partnerskie
Niektóre z linków na tej stronie to tzw. „linki partnerskie”, co oznacza, że jeśli klikniesz na link i dokonasz wymaganej akcji (np. zakup/rejestracja) możemy otrzymać za to prowizję. Pamiętaj, że polecamy tylko te produkty i usługi, z których sami korzystamy, i uważamy, że są tego na prawdę warte… :-)
Znaki towarowe i nazwy marek
W niektórych wpisach (oraz innych miejscach na stronie) mogą być przedstawione/użyte znaki towarowe i/lub nazwy marek, które stanowią własność intelektualną tych podmiotów, a zostały użyte wyłącznie w celach informacyjnych.
Na WebInsider.pl korzystamy z motywu Extra od Elegant Themes. Zobacz dlaczego...