LoginSignup
11
6

More than 3 years have passed since last update.

AndroidのGoogle ChromeでUIとウェブコンテンツを強制的にダークテーマにする

Last updated at Posted at 2019-06-20

注意 この記事で紹介する方法は開発途中の機能を有効にするものを含みます。また、画像はAndroidタブレットのもので、画面やボタンの配置は異なる可能性があります。

この記事はGoogle Chrome 88向けです。以前のバージョンを使用している場合は、記事タイトル右上の点が3つ並んでいるメニューの編集履歴から、古いバージョン用のやり方を見ることができます。

また、この記事と同じ内容を私のブログにも投稿してあります。

UIをダークテーマにする

簡単です。

Chromeのメニュー(画面右上の丸が縦に3つ並んだマーク)> 設定 >
基本設定 > テーマ > 暗

を選択すればUIをダークテーマにできます。

ウェブコンテンツを強制的にダークテーマにする

ダークテーマに対応しているサイト(コンテンツの見た目を設定するCSSのメディアクエリでprefers-color-schemeを使用しているサイト)なら、上記のUIの変更だけでコンテンツもダークテーマになります。

ところが、現時点で対応しているサイトはほとんどありません。そこで、コンテンツを強制的にダークテーマにするために、Chromeの試験機能を使います。

まず、Chromeを開き、検索窓に

chrome://flags

と入力します。

すると、開発途中の機能の有効・無効を切り替えるメニューが表示されます。

IMG_20190621_021225_672.jpg

ページ内検索か、画面上部のSearch flagsに

dark

と入力し、[Darken websites checkbox in themes setting]という項目を[Enabled]にします。

すると、画面下部に

Your changes will take effect the next time you relaunch Google Chrome.
訳:変更は、次回Google Chromeを再起動したときに有効になります。

と表示されるので[Relaunch]を押して再起動します。

再起動したら、設定の基本設定のテーマで、[システムのデフォルト]か[暗]を選びます。[ウェブサイトを暗くする]というチェックボックスが表示されるので、チェックを入れます。

すると、あらゆるWebページがダークモードで表示されるようになります。上手くダークにならない場合は1度Chromeを閉じてもう1度起動してみてください。

結果

ChromeのUIとウェブサイトの表示の両方をダークモードにすると、下の画像のようになります(画像はQiitaのトップページ)。以前試験機能の別の項目しか方法がなかったときはコンテンツをダークテーマにすると画像の色が反転していましたが、今は問題ありません。

Screenshot_2020-03-29-15-59-54.png

ただし、サイトによっては配色が不自然になることがあります。また、背景が透過に設定されている画像が見にくくなったり、文字が読みにくくなったりする可能性もあります。気になる場合、ダークモードにするのはUIのみにしましょう。

下の画像は、以前試験機能の別の項目しか方法がなかったときにコンテンツをダークテーマにした際のスクリーンショットです。配色や画像の色が不自然でしたが、現在は改善されているのが分かります。

Screenshot_2019-06-21-02-43-31.png

設定の解除

UIのダークモードを解除したい場合は、ダークモードにしたときの設定画面で[明]を選んでください。

コンテンツをダークモードにする試験機能を解除するには、設定の基本設定のテーマで、[ウェブサイトを暗くする]チェックボックスのチェックを外してから

chrome://flags

で[Darken websites checkbox in themes setting]を[Default]に戻します。

すると、画面下部に

Your changes will take effect the next time you relaunch Google Chrome.
訳:変更は、次回Google Chromeを再起動したときに有効になります。

と表示されるので[Relaunch]を押して再起動します。

11
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
6