MacOS Mojave ile birlikte gelen Karanlık Mod seçeneği sayesinde artık web sitenizde kullanıcının bilgisayarının görünüm moduna göre light veya dark olarak 2 farklı görünüm oluşturabilir, web sitenizde anlık değişiklik yapabilirsiniz.

Web Profu her hafta e-postanızda. Ücretsiz abone olmak için tıklayın.

MacOS Mojave , macOS serisinin 15. büyük sürümüdür. WWDC 2018 etkinliğinde tanıtılmış olup 24 Eylül 2018 tarihinde ise tüm kullanıcılara sunulmuştur. 

Karanlık Mod (Dark Mode)

Şuanda sadece Safari Tech Preview uygulaması ile bu özellik aktif olarak çalışır durumda , ancak üzülmeyin Safari ve Chrome kısa zaman içerisinde gönderecekleri güncelleme ile bu efektin kullanılabilir duruma geleceğini umuyoruz. 

Webprofu Dark Mode

Kullanımı oldukça basit css kodunuzda @media (prefers-color-scheme: dark) { }  arasına ilgili kodlarınızın renk kodlarını yazarak sizde sitenizde hemen aktif edebilirsiniz.

/* light modu ile çalışacak css kodlarınız */
body {
  color: #333;
}

/* dark modu ile çalışacak css kodlarınız */
@media (prefers-color-scheme: dark) {
  body {
    color: #ddd;
    background-color: #222;
  }
}

Eğer sizde MacOS Mojave sürümünü kullanıyorsanız  Safari Tech Preview uygulamasını indirerek www.webprofu.com olan web sitemizi dark mode olarak görüntüleyebilirsiniz.


Daha fazla kaynak;

Görüşlerini Paylaş

Benzer Web Tasarımı Yazıları