Safari、ダークモード非対応サイトを自動で暗くする「Adaptive Dark Mode」を導入
Safari introduces Adaptive Dark Mode in 27.3
Safari 27.3 betaで、ダークモード非対応の明るいサイトを自動的にダーク表示へ変換するAdaptive Dark Modeが登場。WebKitエンジン内部で色の輝度を反転しつつ色相を保ち、WCAG 4.5:1のコントラスト比を意識して文字やボタンの視認性を確保する。ページ読み込みの約40%がダークモード利用者によるものの、対応サイトはわずか10%にとどまるギャップを埋める狙い。サイト側がAdaptive Dark Modeの適用を検知できないよう配慮し、プライバシーも守る。
ページ読み込みのほぼ40%がダークモード利用者によるものだが、それをサポートしているのはわずか10%にすぎない。
HNでの議論
206- kickingvegas
ご参考までに、CSSのlight-dark()は今や使えますよ。
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/V...
- nsoam
私は逆が欲しいです。乱視があるので、黒地に白は読みづらいんです。Safariがダークモードのサイトをライトモードのサイトに変えてくれたらいいのに。
- marcellosso
私は何でもダークモードを使うので、これはかなり嬉しいです。明らかにライト向けにデザインされたサイトもあって、そこにダークを強制すると体験を壊す可能性がありますが、まさにそういう時のための`color-scheme: light only`ですし、Safariがそれを尊重するのは良いことです。それ以外は私にとってはウィンウィンに感じます。ダークモードユーザーには最高ですし、開発者側もほとんど変わりません。サイトに影響を与えたくなければ「light only」を追加するだけです。
- greazy
みんなDark Reader拡張機能をチェックすべきです。何年も前から適応型ダークモードをやっていて、カスタマイズもできます。ライトモードにも対応しています。今まさにFirefoxでHNに使っています！
- macNchz
個人的にはiOSでこれが来るのが楽しみです。退屈なものをダークモードで最小輝度にして読むのが、私にとっては一番簡単に眠りに落ちる方法なんです（ブルーライトやベッドでスマホ禁止というアドバイスとは逆ですが）。OLEDスクリーンだと、試したどの代替手段よりも発光量がはるかに少ないんです。HNのようなネイティブのダークモードがないサイト（HNのスレッドにはかなり退屈なものもあります）では、画面の色を反転させる「アクセシビリティショートカット」機能を設定するのが私の解決策でした。ロックボタンを3回押すとページが反転します。まあまあ動きますが、サイトがダークモードをサポートしているかどうかに応じて、サイトごとに手動で介入する必要があります。
- Reason077
Hacker News自体がダークモードをサポートしていないサイトの代表例ですが、簡単に実装できるはずです（そして、私の意見では、そうしたらもっとずっと良く見えるでしょう！）
- JulianPaul
まだ私だけでしょうか、ダークモードを使わないのは？私の乱視では耐えられないんです。
- AndrewStephens
これは良いことです。
少し前にブログにダークモードを追加したのですが、きちんとやるのは少し骨が折れました。
次のCSSを追加するだけで、いい加減なダークモードを自分で実装できます。
@media(prefers-color-scheme: dark) {
body {
filter: invert();
}
}
画像もすべて反転されてしまい、写真にはうまくいきません。