Mozillaは先日に最新版を公開したFirefox 67に関して、「Firefox 67: Dark Mode CSS, WebRender, and more - Mozilla Hacks - the Web developer blog」においてオペレーティングシステムのダークモードに対応してWebページのCSSをダークモードに切り替える機能を追加したと伝えた。

この機能はすでにSafariでも実装されているが、Google Chromeはまだこの機能を導入していない。

  • ダークモードに合わせてページのCSSもダークモードを使用するFirefox 67

    ダークモードに合わせてページのCSSもダークモードを使用するFirefox 67

  • すでにSafariは同じ機能を実装済み

    すでにSafariは同じ機能を実装済み

  • Google Chromeにはまだこの機能は導入されていない

    Google Chromeにはまだこの機能は導入されていない

最近の主要Webブラウザはオペレーティングシステムのダークモードに対応している。オペレーティングシステム側のカラーテーマをダークモードに変更すると、WebブラウザのUIカラーもダークモードに置き換わる。しかし、Webページは従来のカラーを前提として設計されたものが多く、多くのページが白背景でダークモードとの相性がよくないことが多い。

今回Firefoxが実装したのはWebページのCSSを切り替える機能の1つで、オペレーティングシステムがダークモードを使っている場合、Webページがダークモード用のCSSを用意しているのであればそちらを使うようになる。この機能によってダークモードに対応したWebページの表示がよりダークモードになじむようになる。規約は現在標準化が進められており、いずれはすべての主要Webブラウザが対応すると見られる。