Dark Mode pentru site-ul tău cu o singură linie în CSS

Google vrea să aducă Dark Mode pe Chrome, astfel încât să poți vedea site-urile web într-un fel de mod noapte. Deocamdată treaba asta e în teste. Am descărcat și eu Google Canary, am testat modul întunecat și cred că mai au de lucru la el.

Din fericire, poți avea Dark Mode pe site-ul tău cu ajutorul unui filtru simplu în CSS: invert. Am mai văzut filtrul acesta aplicat pe imagini, însă îl poți aplica pe toată pagina web.

Dacă ai blog WordPress, trebuie să pui codul de mai jos la Aspect – Personalizare – CSS suplimentar.

Acesta este codul:

body{filter: invert(100%)}img{filter: invert(100%) opacity(0.8)}

Primul filtru inversează culorile pe toate elementele din pagină. Cel de-al doilea ia imaginile și le mai inversează o dată, astfel încât să rămână neschimbate. Filtrul de opacitate l-am pus pentru imaginile albe.

În loc de opacity(0.8) poți pune sepia(100%). Arată într-un mare fel.

Testez Dark Mode și pe acest blog. De la ora 20:00 până la 06:59 sunt în modul întunecat.

Etichete:,

4 comentarii

Dă-ți cu părerea

Adresa ta de email nu va fi publicată.