Google ChromeでWebサイトにダークモードを適用する方法

PCおよびモバイルソフトウェアのダークテーマが、最近人気です。Windows 11の色パーソナライズ設定でダークを選択することで、Google Chromeにダークモードを適用できます。このオプションは、Chromeに黒いユーザーインターフェイスを適用しますが、Webサイトの背景色は変更しません。

しかし、ChromeのダークモードをWebサイトにも拡張したい場合はどうすればよいでしょうか？その場合は、拡張機能の有無にかかわらず、Webページに黒い背景を適用して、Chromeページを暗くすることができます。GoogleのフラグシップブラウザでWebサイトにダークモードを適用する方法は次のとおりです。

Chromeフラグ設定を有効にしてWebサイトにダークモードを適用する方法

Google Chromeには、Webサイトのコンテンツを黒のテーマでレンダリングするオプションがあります。ただし、そのオプションはChromeの実験タブに隠されたフラグ設定です。Webコンテンツの自動ダークモードフラグを有効にすることで、Webサイトにダークモードを適用できます。

1. Google Chromeを開き、ブラウザのURLアドレスバー内をクリックします。
2. Webサイトアドレスバーにchrome://flags/と入力し、Enterキーを押します。
3. 実験タブの上部にある[フラグを検索]ボックスにキーワードenable-force-darkを入力します。
4. Webコンテンツの自動ダークモードオプションのドロップダウンメニューで有効を選択します。
5. Chromeの下部に表示される再起動ボタンをクリックします。

これで、Chromeの新しいダークWebサイトモードを確認できます。ブラウザでGoogleページを開きます。その検索エンジンには、ダーク背景が表示されます。以前は白の背景だったすべてのWebサイトは、白のテキストでダークになります。

Webコンテンツの自動ダークモードフラグには、他にもいくつかの有効なダークモード設定があります。これらのオプションは、ダークモードにさまざまな効果を適用します。フラグのさまざまな設定を適用して、その効果を確認してみましょう。

Dark Reader拡張機能でWebサイトにダークモードを適用する方法

Chromeには、同様のダークモードをWebサイトに適用できる拡張機能もあります。Dark Readerはそのような拡張機能の1つで、いくつかの優れたオプションが含まれています。Dark ReaderをGoogleのフラグシップブラウザに追加するには、ウェブストアページのChromeに追加ボタンをクリックします。

Dark Readerをインストールしたら、ChromeのURLツールバーにあるその拡張機能のボタンをクリックします。表示されない場合は、拡張機能ジグソーピースのアイコンをクリックして、Dark Readerのピン留めオプションを選択します。次に、下のスクリーンショットのようにDark Readerボタンを押してアドオンを開きます。

デフォルトで選択されていない場合は、そこでダークモードオプションをクリックします。これにより、ほとんどのWebページに黒い背景が適用されます。拡張機能のライトまたはオフオプションをクリックすると、簡単に元に戻すことができます。

拡張機能の他のオプションを使用して、ダークテーマをカスタマイズすることもできます。明るさ、コントラスト、セピア、グレースケール設定の左右の矢印ボタンをクリックして、これらのオプションを構成します。これらの設定を開いているWebページにのみ適用したい場合は、のみオプションを選択します。

特に選択しない限り、ダークテーマはすべてのWebサイトに適用されます。下のスクリーンショットのように、Dark Readerのサイトリストタブをクリックします。そこで、リストしたもののみを反転を選択することで、拡張機能が黒いテーマを指定されたWebサイトにのみ適用されるように構成できます。次に、黒い背景を追加するWebサイトのURLを入力します。

Dark Readerのその他タブには、Webページの追加のカスタマイズ設定が含まれています。その他タブのフォントを選択ドロップダウンメニューをクリックして、Webサイトのフォントを変更できます。そこでフォントを選択し、Xボタンを押して適用します。

ダウンロード：Google Chrome用Dark Reader（無料）

Super Dark Mode拡張機能でWebサイトにダークモードを適用する方法

Super Dark Modeは、ChromeのWebサイトに暗い背景を追加できるもう1つの優れた拡張機能です。この拡張機能のユニークな点は、特定の時間間隔でダークモードをスケジュールするオプションも含まれていることです。下のSuper Dark Mode for Chromeのハイパーリンクをクリックし、Chromeに追加を押して、このアドオンをGoogleのフラグシップブラウザにインストールします。

ブラウザでGoogle検索エンジンを開きます。Chromeの拡張機能ボタンとSuper Dark Modeアドオンをクリックして、Googleの黒い背景をオン/オフにします。Super Dark Modeをインストールする前に、ブラウザで既に開いているページを更新して、黒い背景が適用されるようにする必要があります。

適用される黒い背景を構成するには、Chromeの拡張機能メニューを開きます。次に、Super Dark Modeの横にある3点ボタンをクリックしてオプションを選択します。これにより、多数の設定が含まれるSuper Dark Mode拡張機能タブが開きます。

一般ダークテーマタブでモダンラジオボタンを選択します。次に、背景カラーボックス内をクリックして、任意の色を選択できます。背景を暗く保つには、パレットで別の黒の濃淡を選択します。テキストとリンクパレットボックスをクリックすることで、リンクとテキストの色を変更することもできます。

スマート反転オプションは、そこで選択するのに適しています。この設定は、Webサイトの色を反転して、テキストをダークモードでより鮮明にします。デフォルトのモダンダークテーマの代わりにこのオプションを選択すると、テキストが少し鮮明になります。

特定の時間間隔でダークなWebサイトの背景を有効にすることを好む場合は、自動スケジュールタブをクリックします。そこで、時間間隔中にSuper Dark Modeを有効にするチェックボックスを選択できます。開始ボックスにダークモードをオンにする時間を 입력します。次に、終了ボックスに黒いWebサイトの背景を無効にする別の時間を入力します。

Super Dark Modeの詳細設定タブで、ページの明るさを調整できます。すべてのサイトのコントラスト/明るさを調整するオプションを選択します。次に、バーのスライダーを左右にドラッグして、ページの明るさを上げたり下げたりします。

特定のWebサイトのダークな背景を除外するには、Super Dark Modeのホワイトリストタブをクリックします。そのタブのテキストボックス内に、黒い背景を適用しないWebサイトのドメインを入力します。または、ページを右クリックしてSuper Dark Mode>このサイトでSDMを無効にするを選択して、Webサイトをホワイトリストに追加することもできます。

ダウンロード：Google Chrome用Super Dark Mode（無料）

Google Chromeにさらに暗い側面を追加する

ダークモードがお好きなら、Google Chromeのenable-force-darkフラグ設定、Dark Reader、Super Dark ModeがWebサイトに追加する黒い背景が気に入るでしょう。

enable-force-darkフラグを有効にすることは、サイトに基本的なダークモードを追加するには適していますが、拡張機能は追加のカスタマイズ設定でより大きな柔軟性を提供します。黒い背景をWebサイトに適用すると、Windowsのダークモードと組み合わせたときに、Google Chromeにさらに暗い側面が与えられます。