acokikoy's notes

最近気になる=[NoCode, Shopify], I am..=[Python, ウクレレ, マニュアル車, CMS] LoveなWebディレクター

Sublime Text :: カラースキームをカスタマイズする方法

Sublime Text。日本では何だか絶滅危惧種扱いだが、英語圏では今も健在。軽快でしっくり手に馴染むマスト・バイなエディタだ。

さて、ワタクシ、Sublime Text 3 では Dracula というカラースキームを愛用している。

気に入って使っているのだが、唯一 コメントの色と背景色とのコントラスト差が小さく見づらいなぁと常々思っていた。
Draculaに限らず Monokai でも何でも おしゃれ系ダーク・テーマの コメント はなぜだか見づらいよね。
コメントは docstrings として使われるわけで、いわばドキュメントあるいは機能仕様書。
大事な情報なんだから、目を凝らしてやっと読めるような色でなく、もっと視認性の良い色であってほしい。

調べたらカスタマイズ方法がわかったので記事に残す。

Dracula のカラースキームファイル

Dracula は、VS Code, Atom, Vim, Emacs をはじめ多様なツールに対応するダーク系のテーマだ。

↓本家サイトのSublime Text用情報はここ↓ draculatheme.com

Package Control を使って普通にインストールすると、バイナリファイルで入ってくるらしくカスタマイズできないので、GitHubから手動でダウンロードする方法で Dracula をインストールする。

手動インストールする方法

手動でインストールする方法は、本家サイトに書いてある。
要はこうだ。

  • GitHubからzipダウンロード し、展開する。
  • Dracula.tmThem がカラースキームが書かれた xml形式 のファイル。
  • フォルダ名を「Dracula Color Scheme」にリネームする。
  • Sublime Text のPreferences > Browse Packages...(メニューを日本語化している場合は 基本設定>パッケージフォルダ...) から、パッケージフォルダ(↓具体的にはココ)に移動する。
    /User/MY_ACCOUNT/Library/Application Support/Sublime Text 3/Packages/

  • さっきの「Dracula Color Scheme」をフォルダごとここに保存する。

tmThem ファイルの編集ツール

ところで、 カラースキームファイルは自分でチクチク編集する必要はなくて、立派なツールが用意されている。

tmtheme-editor.herokuapp.com

変えたい要素のカラーチップをクリックすると、パレットが表示されるから好みの色に変更する。
変更後、「save: Download」の緑のボタンから結果をダウンロードし、
前述の Dracula.tmThem ファイルを差し替えれば即反映される。

Draculaだけでなく、「Gallery」から Monokai 始め沢山のカラーテーマがロードできる。
また、「Open」からは、自作のファイルをアップロードして編集できる。
画面右下から、 Python とかJavaScript とか好みの言語に切り替えて出来栄えを確認できる。

素晴らしい!!

f:id:acokikoy:20190211194338p:plain

stackoverflowに似たようなことで困っている人がいて、このツールはそのスレッドで発見した。

感謝。
stackoverflow.com