La Dark Mode in CSS, cos’è e come funziona

Sempre più applicazioni e sistemi operativi stanno adottando la funzionalità della “dark mode”, ma che cos’è?

E’ la capacità di ridurre il consumo della batteria di un pc portatile o smartphone e ha la potenzialità di non stancare gli occhi degli utenti.
L’obiettivo è quello di utilizzare una luce blu inferiore rispetto agli standard normali.

Quali sono i vantaggi e gli svantaggi della Dark Mode?
Al momento si sta ancora discutendo quali siano i veri pregi e difetti di questa modalità. Come precedentemente detto, si presuppone che migliori la batteria di alcuni dispositivi, PC e Smartphone dotati di uno schermo OLED, tecnologia posseduta dalla maggior parte degli schermi più venduti.

L’altro lato positivo riguarda la visione in notturna, è noto che le varie luci che vengono emesse da dispositivi elettronici, con una certa tonalità, possono provocare insonnia o difficoltà alla retina dell’occhio.

Dei veri e propri svantaggi non ci sono, possono però provocare fastidio, o addirittura dei piccoli danni, agli individui affetti da astigmatismo.

I benefici fisici legati alla vista non sono ancora stati totalmente confermati, anzi, la questione è tuttora aperta.

Dark mode

La Dark Mode, è molto semplice da impostare sia nei telefoni Apple che Android, nelle impostazioni di Schermo e luminosità c’è la possibilità di attivarla in un click, ma anche nei Mac e PC.

Come posso implementare sul mio sito web questa modalità?
Per utilizzare questa modalità, ci sono vari plugin in JS e CSS facili da implementare nel proprio sito web, eccone qualcuno di semplice utilizzo:

https://darkmodejs.learn.uno/ 
https://www.developerdrive.com/css-dark-mode/
https://dev.to/ananyaneogi/create-a-dark-light-mode-switch-with-css-variables-34l8

Se invece si utilizza WordPress, ci sono un paio di plugin semplici da attivare, il più utilizzato e facile da installare è Blackout Darkmode Widget che lo si può scaricare facilmente dall’elenco dei plugin oppure dal sito web ufficiale: https://wordpress.org/plugins/blackout-darkmode-widget/