この記事では、パソコンのGoogle Chromeの全サイトで、ダークモードを強制適用する方法を紹介します。
通常、ダークモードをオンにすると背景が黒系統になりますが、サイト側が対応していないと変化しません（背景は白系統のまま）。
そういったダークモードに対応していないサイト含め、すべて黒基調のデザインに変化できますよ。
ダークモードを強制適用したYahooトップページ
関連記事 Android版Chromeでダークモードを強制適用する方法
関連記事 iPhone版Safariでダークモードを強制適用する方法
関連記事 Mac版Safariでダークモードを強制適用する方法
Dark Reader – Chromeの全サイトにダークテーマを強制適用する方法
Dark Readerをインストールします。
Dark Readerを追加
どのWebサイトも、背景がすべて黒になります。
▼通常
通常の当サイト
▼適用後
ダークモードを適用した当サイト
拡張機能のメニューより、設定変更できます。
①拡張機能を開く → ②Dark Readerを選択
設定は、主に4つあります。
- 切り替えを自動化する
- 明るさ等を調整する
- 特定サイトのみ適用or対象外とする
- その他
▼切り替えを自動化する
Dark Readerのオン/オフを自動化できます。
例えば システムの色のモードに従う を有効にすれば、Windows/Mac標準のダークモードと連動して切り替え可能です。
赤枠から設定する
Windowsの例。設定の「個人用設定」→「モードを選ぶ」で、ダークモードへ切り替えできる。
Macの例。システム設定の「外観」→「外観モード」で、ダークモードへ切り替えできる。
▼明るさ等を調整する
ダークモード中の輝度やコントラスト、セピア、グレースケールを調整できます。
赤枠のスライダを左右に動かす
▼特定サイトのみ適用or対象外とする
あるサイトだけ設定を変えたい場合、サイトリストが便利です。
| サイトリスト | 意味 |
|---|---|
| ホワイトリスト | 入力したサイトのみ ダークモードを適用する |
| ブラックリスト | 入力したサイトは ダークモードを対象外とする |
ホワイトリストを設定した例
ホワイトリストにあるYahooトップページは、ダークモードが適用される例
▼その他
ダークモード中の文字フォント・縁取りなど、調整できます。
赤枠で設定できる
〆：すべてのサイトをダークモードへ切り替えよう!
以上、パソコン版Chromeでダークモードを強制適用する方法! 拡張機能ですべてのサイトをナイトモードへ切り替えよう の説明でした。
WindowsやMacの標準機能としてダークモードは存在しますが、ブラウザ上ではサイト側で個別対応していないかぎり、従来の明るい背景のまま表示される仕様となっています。
そこで今回紹介したDark Readerを使えば、強制的に黒基調のデザインに変化できるので、夜間にブラウジングする機会が多いならオススメです。
たとえば以下サイトは、通常ダークモードに対応していませんが、強制適用できますよ。
- Note（https://note.com/）
- 食べログ（https://tabelog.com/）
- 価格.com（https://kakaku.com/）
- Yahoo!知恵袋（https://chiebukuro.yahoo.co.jp/）
- アメーバブログ（https://ameblo.jp/）
なおDark ReaderはChrome以外にも、各主要ブラウザで提供されてます。
唯一、Macユーザー向けのSafari版は有料となりますが、無料で実現する方法もあります。詳しくは関連記事をどうぞ。
コメント
めちゃくちゃ助かりました！
ありがとうございました。