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.

Legătură ușoară:

https://usor.ro/8659

Distribuie mai departe:

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

  1. Bun… care este avantajul ca site-urile se vad in Dark Mode?

  2. Interesanta metoda. Eu nu pot s-o aplic deocamdata din cauza fundalului alb de la un logo si transparent de la altul. E prea deranjant contrastul.

  3. Eu nu mă pot concentra deloc pe site-urile dark. Ba chiar ies de pe ele în secunda 2.

Adaugă un comentariu

Scrie comentariul tău în căsuța de mai jos. Publicând comentarii pe acest blog, accepți politica de confidențialitate.

Completează numele tău. Adresa de email și site-ul web sunt câmpuri opționale și le poți lăsa necompletate.