グレースケール表示への切り替え方

参考：色を用いた表現に関する注意点

ブックマークレットの利用

以下の手順でブックマークレットを利用することで、ブラウザーに表示中のページをグレースケール表示にすることができます。なお、このブックマークレットが正常に動作しないブラウザーを使っている場合、Webページ以外のものの表示を確認する場合には、後述するOSの表示切り替え機能を使います。

  1. 以下のコードをターゲットとするブックマーク（ブックマークレット）を作成。

    コードを表示
    javascript:(function(){var d=document;s=d.createElement("style");s.innerHTML="*{filter:grayscale(100%) !important}";d.body.appendChild(s)})()
    表示中のページをグレースケール表示にするブックマークレット

  2. チェック対象のページを表示した状態で、このブックマークレットを実行。

OSの表示切り替え機能の利用

Windows 10の場合

  1. 「設定」の「簡単操作」を開く（Win + U）。

  2. 「カラーフィルター」をクリック。

  3. 「カラーフィルターをオンにする」をチェック。

  4. 「グレースケール」を選択。

頻繁に利用する場合は、同じ画面でショートカットキーを有効にすると便利でしょう。

macOSの場合

  1. 「システム環境設定」を開く

  2. 「アクセシビリティ」を開き、左側のメニューから「ディスプレイ」を選択

  3. ここから先はmacOSのバージョンにより異なります

    • Catalinaの場合、上部のタブから「カラーフィルタ」を選択し、「カラーフィルタを有効にする」のチェックを入れ、「フィルタタイプ」で「グレイスケール」を選択

    • Mojave以前の場合、「グレイスケールを使用」にチェックを入れる

参考：Macでアクセシビリティの「ディスプレイ」環境設定を変更する - Apple サポート