SumatraPDF の配色を見やすくしたい！！

SumatraPDF は、PDF、ePub、Mobi、XPS、DjVu、CHM、CBZ、CBR を閲覧することが出来る Windows 用の無料リーダーです。

SumatraPDF の取得は以下から。

Free PDF Reader - Sumatra PDF ver.3.2（2020/9 現在）
最終更新時: ver.3.4.3

デフォルトでの配色は非常に目が疲れるので、任意に配色を変更して見やすくしていきたい。

設定の表示と変更

左上の ☰ から 設定 (S) > 詳細設定 (A) と進めば txt ファイルで設定を変更することが出来る。または、以下のディレクトリに格納されているので直接編集する。

%APPDATA%\Local\SumatraPDF\SumatraPDF-settings.txt

設定の詳細は以下から見ることが出来る。

SumatraPDF-settings.txt では、以下のように # に続く 16 進数のカラーコード (Hex 値) で表現されている。このカラーコードを書き変えることで任意の色に変更することが出来る。今回、変更していきたい設定は以下の部分になる。

MainWindowBackground = #fff200
FixedPageUI [
	TextColor = #000000
	BackgroundColor = #ffffff
	SelectionColor = #f5fc0c
	WindowMargin = 2 4 2 4
	PageSpacing = 4 4
]

※ この他にも設定項目がありますが、今回は全く触れません。

注意

設定の変更にはいくつか注意点がある。

MainWindowBackground では SumatraPDF 全体の背景色を選択するものの、これを安易に #000000 にすると文字が読めなくなる場合がある。
- これは文書プロパティ等の閲覧ウィンドウにもこの設定が効いているためで、そのくせ閲覧ウィンドウの文字色は黒から変更することが出来ない。黒地に黒文字というサイアクなことになる。
コメントアウトの方法は存在しないようだが、設定ファイルの最終行の以下の部分より下に張り付けておけば、いつでもコピペで変更することが出来る。

# Settings after this line have not been recognized by the current version

もっと楽な方法があると良いが、現状ではこの方法しかなさそうである。

また、コマンドラインから -invert-colors によって反転させることが出来る。しかし、この方法は将来のバージョンで削除される可能性があるため非推奨のオプションとされている。

Command-line arguments - SumatraPDF documentaiton

○ デフォルトでの配色

SumatraPDF のデフォルトでの配色は、以下のようになっている。

Sample image: Default theme

それぞれの配色と設定名を対応させると次の表のようになる。

Settings	Color	Color sample
`MainWindowBackground` 背景色	`#fff200`
`TextColor` 文字	`#000000`	(Black)
`BackgroundColor` 文書背景色	`#ffffff`	(White)
`SelectionColor` 文字選択色	`#f5fc0c`

MainWindowBackground = #fff200
FixedPageUI [
	TextColor = #000000
	BackgroundColor = #ffffff
	SelectionColor = #f5fc0c
	WindowMargin = 2 4 2 4
	PageSpacing = 4 4
]

白黒でハッキリしているが、目がチカチカして疲れる
背景色が黄色なのもかなり派手

ということで、以下のように変更してみよう。

○ 配色の変更

以下のような 2 つの配色パターンを作成してみた。配色は Google のカラーピッカーを利用して作成した。

色彩に関してド素人の人間が作成しているので万人には良くないかもしれないですが、個人的には非常に満足しているので自慢げに紹介します。

■ 目に優しそうな配色

通常の配色からかけ離れないことを心掛けた。

Settings	Color	Color sample
`MainWindowBackground` 背景色	`#7fd486`
`TextColor` 文字	`#0d0116`
`BackgroundColor` 文書背景色	`#fcf6e6`
`SelectionColor` 文字選択色	`#5b89f5`

MainWindowBackground = #7fd486
FixedPageUI [
	TextColor = #0d0116
	BackgroundColor = #fcf6e6
	SelectionColor = #5b89f5
	WindowMargin = 2 4 2 4
	PageSpacing = 4 4
]

Sample image: Easy on eyes theme

背景色は黒板風に
文字はブラック JIS
文書背景色は柔らかなクリーム色に (かなり黄色めかもしれない)
画像の色は変わらない

■ ダークテーマ

ブルーブラックな配色に作った。

Settings	Color	Color sample
`MainWindowBackground` 背景色	`#989898`
`TextColor` 文字	`#d9d4d2`
`BackgroundColor` 文書背景色	`#001522`
`SelectionColor` 文字選択色	`#119c0c`

MainWindowBackground = #989898
FixedPageUI [
	TextColor = #d9d4d2
	BackgroundColor = #001522
	SelectionColor = #119c0c
	WindowMargin = 2 4 2 4
	PageSpacing = 4 4
]

Sample image: Dark theme

文書背景色はブルーブラックに
文字は少しトーンを落とした
画像の色が変わる

○ Adobe Acrobat Reader DC で同じことをしたい！

PDF リーダーとして標準的に利用されているのは Adobe Acrobat Reader DC だろうか。
これでも同じように配色を変更したい。

Continuous Release | ver.2020.012.20043

■ テーマの変更

デフォルトはライトテーマになっており白ベースになっている。これをダークテーマに変更したい。

表示 (V) > 表示テーマ (H) > ダークグレー(D)

リーダー全体がダークグレーに変更される。

■ アクセシビリティの変更

編集 (E) > 環境設定 (N) > 分類 (G) > アクセシビリティ

ここから、文書のカラー設定オプションの「カラーの表示を調整」のチェックボックスにチェックを入れると、カスタムカラーを使用することが出来る。
このカスタムカラーはカラーパレットから「ページ背景色」と「テキスト色」を任意に変更することが出来る。

ここでは特に色の紹介はしないが、上と同様の色にしてみてはどうだろうか。

参考

この他、キーボードショートカットの一覧などを見ておくとより良く利用できるようになるだろう。

Keyboard shortcuts - SumatraPDF documentaiton

サンプルの PDF ファイルは PDF.js のドキュメントを利用した。

compressed.tracemonkey-pldi-09.pdf

さいごに

自分の好きな色で、目が痛くなるような配色はなるべく避けて、長時間の閲覧でも疲れない配色にしよう！

配色に関して、目に優しくかつ見やすい色サブセットをググっても意外と出てこない (調べ方が悪かったか??)。あまりこのようなことに時間をかけるのもばかばかしいので、適度に見切りをつけて変更していけると良いだろう。
配色を考えるのが面倒だが白黒は見づらいから変更したい!! という人は、ぜひこの記事の配色をパクって効率的に閲覧してほしい。

SumatraPDF を利用している人は、ビューワとして SumatraPDF を利用し、印刷時には Adobe Acrobat Reader を利用しているのではないだろうか。
Acrobat Reader の配色の変更を紹介したが、アクセシビリティの変更はあまり必要ないかもしれない。

Version 3.4.x

バージョン 3.4 以降、さまざまな機能が追加された。代表的なものを列挙しておきたい。

コマンドパレットの追加 (Ctrl+K)
キーボードショートカットのカスタマイズ
選択文字列の検索や翻訳検索をブラウザに送信
SVG ファイルのサポート
アノテーションのサポートの向上
色反転のためのキーボードショートカットの追加 (i)

本記事で特に重要な点は、色反転のためのキーボードショートカットの追加になるだろう。PDF を開いて i を押下すると色が反転する。ページ番号を表示させるためのキーボードショートカットは I に変更された。

また、コマンドパレットで扱われるコマンドに関しては以下の記事を参照してほしい。かなり多くのコマンドが追加されている。これらをキーボードショートカットにすることも出来る。

Command Palette - SumatraPDF Manual

Full list of commands SumatraPDF - Gist

Future version

ツールバーなどのテーマについて、以下のような issue が上がっている。

色見本表示

Markdown でカラーコードの色見本を表示する Tips - Qiita

Qiita ではカラーコードを打てば自動的に色見本を表示させてくれるが、上記事を参考にあえて大きく表示させてみました。サンプルとして以下に示しておく。

https://via.placeholder.com/<box size>/<box color>/<text color>/?text=%20
https://via.placeholder.com/30x60/000000/FFFFFF/?text=%20

cf. Placeholder.com

追記

2020/09/08 : Adobe Acrobat Reader DC での配色の変更方法を追加しました。
2021/07/27 : 軽微修正。
2021/10/07 : サンプル画像を追加。
2022/06/03 : ver.3.4.x について追記。