Design · 2026-02-10 · 5 min

Dark mode: la feature che gli utenti si aspettano (e che la maggior parte dei siti sbaglia)

Diversi sondaggi di settore (tra cui dati citati da Adobe sulla Gen Z e da Litmus sugli utenti Android) riportano quote di preferenza per il dark mode spesso superiori al 70%, specialmente tra gli utenti più giovani e su prodotti usati di sera o per molte ore consecutive. Sono numeri da prendere come indicazione di tendenza più che come statistica scientifica univoca, perché i sondaggi variano molto da fonte a fonte, ma la direzione è la stessa ovunque: il dark mode è un'aspettativa, non un vezzo.

La base: token di colore semantici

Progettarlo bene richiede un approccio diverso dal semplice "invertire i colori". La base solida è un sistema di token di colore semantici (es. --bg, --tx1, --bd) piuttosto che colori hardcoded sparsi nel codice. Quando ogni componente legge i colori da variabili, passare da light a dark diventa un cambio di valori, non un rifacimento.

Errori comuni da evitare

• Nero e bianco puri come estremi. Il contrasto eccessivo stanca la vista. Palette dark più gradevoli usano grigi scuri (es. #0f0f1a) per lo sfondo e bianchi leggermente attenuati per il testo.
• Ombre pensate solo per il light mode. Le box-shadow pensate per sfondi chiari spesso diventano invisibili su sfondi scuri. Spesso la soluzione migliore è un bordo sottile, oppure un'ombra con opacità e colore specifici per il tema scuro.
• Ignorare la preferenza di sistema. Il sito dovrebbe rispettare l'impostazione del dispositivo (prefers-color-scheme) e lasciare comunque all'utente la possibilità di cambiarla.

Il testing non è opzionale

Contrasto testo/sfondo, leggibilità delle icone, stato di focus dei form: un design system ben fatto rende questo testing sistematico invece che un controllo manuale pagina per pagina. E un contrasto corretto in entrambi i temi è anche un requisito di accessibilità, non solo di estetica.