GoogleChromeの見た目を黒くする(ウィンドウとDevTool):GoogleChrome

NO IMAGE

MacOSがMojaveになってからDarkモードが好きです。
そしたらGoogleChromeも黒くしたくなったので見た目も、DevToolも黒い画面にしちゃいました。

2019年3月にリリースされたv73からはMacOS Mojaveのダークモードに対応して画面が黒くなるようになりました。
Windows10ではGoogleChrome v74で規定のアプリモードを黒に設定した場合、画面がダークモードになるそうです。

MacでもWindowsでもGoogleChromeがダークモードに対応したので急にウィンドウが黒になってびっくりしている方もいらっしゃるかもしれませんね。

GoogleChromeのテーマを変えて黒くする

設定画面を開く

スクリーンショット_2019-01-24_23_08_22

chromeの右上のメニューから開いてもいいですし、「Chrome」メニューにある環境設定を開いてもOKです。(もちろんショートカットでも)

テーマを取り込む

ChromeウェブストアからテーマのファイルをGoogleChromeに追加します。

スクリーンショット_2019-01-24_23_09_01

画面中程にあるデザインの項目に移動してクリック。
ウェブストアに移動します。

スクリーンショット 2019-01-24 23.09.22

検索窓に「dark」と入力
スクリーンショット 2019-01-24 23.09.41

おすすめは「Material incomingnito Dark Thema」です。
クリックして移動

スクリーンショット_2019-01-24_23_15_04

画面右上に「Chromeに追加」ボタンがあるのでクリック

 

スクリーンショット 2019-01-24 23.15.47

アドレスバーの下にメッセージが表示されるので見た目を確認。
問題なければ右側の「×」をクリック。

テーマが気に入らないときは「元に戻す」を押して他のテーマを探す。

Chromeが黒くなりました。

スクリーンショット_2019-01-24_23_16_49

テーマが切り替わりました。

初期設定に戻したい場合には設定画面から戻せます。
ただ、もとに戻して再度同じテーマを適用するストレートな方法が実は無くて、一旦別のテーマをインストールしてからまた設定したいテーマをインストールする という方法で再設定はできます。ひと手間かかりますね。

Chromeに保存されるテーマはデフォルトを除けば1つだけらしいので、上記の方法で入れ替える必要があるみたいです。

ここまでで終わりでも良いのですが、折角なので他の画面も黒くしてしまいましょう。

デベロッパーツールの 画面も黒くする

まずはCommand+shift+I(アイ)を押してDeveloper Toolsを起動してからの操作です。

関連記事:GoogleChromeデベロッパーツールをファンクションキーで開く設定:Mac 

Settingsを開く

スクリーンショット_2019-01-24_23_17_59

右上のメニューを押して項目を開く

スクリーンショット_2019-01-24_23_18_12

「settings」の項目を選択する。「F1」押しても良いですよ。

スクリーンショット_2019-01-24_23_18_47-2

Appearanceの項目にThemeがありますので「Dark」を選択してください。

Developer Tools画面が黒くなりました。

スクリーンショット 2019-01-24 23.19.22

 

まとめ

長時間画面を見続けているせいか、歳のせいか、白い画面で作業をすることが辛くなってきました。
画面を黒くすることによって少しでも目に負担がかからないようになればいいなと思います。

他にもGoogleChromeの使い方をいくつか記事で紹介していますので、ご確認ください。

Web/Design/Creativeカテゴリの最新記事