技術情報 / Windows アプリケーション / Chrome / Chrome ユーザスタイルシート等でダークテーマ導入

Chrome ユーザスタイルシート等でダークテーマ導入

1.ユーザースタイルシート

  • メジャーなユーザースタイルシートカスタマイズ拡張機能Stylishは以下の2つ。
  • 共に似たような機能を持つが、Stylishはコミュニティで提供されているスタイルシートが豊富で、Stylebotのそれより質が高いように思われる。
  • Stylebotはコミュニティ提供のスタイルシートは少なく質が悪いが、自分で編集する場合の編集機能は優れている。
  • したがって、GoogleやMicrosoftなどメジャーなウェブサイトの場合、まずはStylishで好みのコミュニティスタイルシートを探す。そこで良いものが見つからなければ、Stylebotで自分でスタイルシートを編集すると良いと思う。

2. 拡張機能 Night Mode Pro による強制ダークモード導入

  • Night Mode Pro mybrowseraddon.com/night-mode.html
  • ウェブページの白黒を反転させて表示する拡張機能。同種の拡張機能は他にもあるが、これが一番出来が良さそう。
  • ただし、機械的に反転表示させているので、不自然な表示になるウェブページも多い。

3. 拡張機能 ハイ コントラスト による強制ハイコントラスト導入

  • Google提供の拡張機能。同種の拡張機能は他にもあるが、いまいち違いが分からないので、Google純正のを使っておいた方が無難だろう。

解説

  • ダークテーマを導入したいウェブサイトがある場合、基本的なスタンスとして、
  • まず1.のユーザスタイルシートを試みる。
  • コミュニティスタイルシートが存在しなかったり、自分でユーザースタイルシートを編集するのが難しかったウェブサイトの場合は、
  • 2.のNight Mode Proを導入する。
  • Night Mode Proを導入してもしっくりこなかった場合は、3.のハイコントラストを使うと良いだろう。

ダークモード導入Chromeのプロファイルを別にする

  • 上のような方法でダークテーマを導入すると当然オリジナルのウェブサイトの見え方が分からなくなる。
  • したがって、IEやEdge、Firefoxのようなブラウザをオリジナルのウェブサイト閲覧用に用意するか、Chrome以外のブラウザを使いたくない場合はプロファイルを新規作成して、どこにダークモードを導入するとよいだろう。
  • プロファイルの新規作成の仕方はこのウィキなどに説明がある。

コメントを残す

メールアドレスが公開されることはありません。

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)