ヴォルフロッシュ

Blog

Published on

RSS

CotEditorの配色

[preview]
CotEditor

みんなCotEditorの設定どんな感じー? のコーナー。

皆様ご愛用のテキストエディタにおかれましては、自分仕様に手塩をかけてカスタマイズしていらっしゃるとは思いますが、人の設定も気になってきますよね。人のを見て「俺のCotEditorちゃんの方がかわいいもんね!」と悦に入るも良し、「そうか、この設定項目にはこんな利点が」とこっそり模倣するも良し。わたくしも人のが気になりつつも、いざ探すとあまり見つからない。

検索かけて出てくるそれっぽい話題のはこの辺でしょうか。

うむ、皆様主義があって興味深い。でも他にも見たいじゃん? だったらまぁまずは自分で晒せよ、と。

キーバインドが気になるとか入れてるスクリプトが気になるとか、人によって興味は違うとは思いますが、私は配色を気にしたい。配色とかフォントとかルックス。追加のCotEditor用シンタックス定義配布してたりするし。コーディング用エディタはカラーリングされてなんぼでしょう。

CotEditorはプリセット配色セットが選べるわけではないので、一歩デフォルト配色から足を伸ばすと、あとは独自カスタマイズの世界。まぁ別にデフォルトの配色がひどいとも特別思わないけど自分好みに弄りたいところ。

とうことで以下、私1024jpの設定の解説です。


ひとまず設定パネルのスクリーンショット。まずは「表示」の項目。

[preview]
環境設定 > 表示

背景色は俄然白です! 黒背景を薦める人も多いのですが、フルスクリーンでテキストエディタだけつかうならまだしも、Macでは他のアプリケーションと行き来しながら使うことが多いことでしょう。もしくは同じディスプレイ上に他のアプリケーションのウィンドウが出ていたり。他のほとんどのアプリケーションは白背景ベースの配色なのにエディタだけ黒だと、それらを行き来したときに地と図が反転してそっちの方が目が疲れます。だからといってクリーム色とかの色付き背景はそれこそ色感覚がぶれてくるので、結局白背景が一番。というのが持論。

それで目がまぶしいなら、むしろ根本のモニタの設定を再調整することをお勧めする。

そして「シンタックス」。けっこう変えてます、現在はこんな配色です。ちなみに、こっからそれぞれカラーピッカーで色を拾えば同じ設定が再現できます。そういう需要があるのかは知りませんが。

[preview]
環境設定 > シンタックス

今では多分少数種の "コメントは赤" 派です。最初使ってたmiがそうだったからだと思う。赤だと怒られてるみたいだから緑に変えようかなぁと試したこともあるのだが、あまりしっくりこなかったので今では開き直っている。緑コメントの方がモダンで洒落てるよね。でもなんというか、緑は変数に割り当てたい(正確にはCotEditorには '変数' という項目がないので '値' で代用している)。この辺は慣れの話ですが。

あとは自分の中でなんだかよくわからない意味付けをしつつ、好みの色でバランスがよくなるように適当に配色してます。

「コマンド」は活発な感じがするから快活なオレンジ、「数値」はなんか地味そうだし、目立たなくてもそんなに困らないので黒に近い紫。「キーワード」は逆の意味でなんか落ち着きを持ってて欲しいので重たい色に。何でもかんでも派手な色だろこれも疲れるから。「文字列」と「文字」はどっちの方が目立つべきかしら?というのはなんか人によって違いそうですが、HTMLを書いたときに値が目立って欲しくないので「文字列」はグレーにしてます。わりとそんな理由。あと「文字」の方が頑なで強そうなので(?)こっちは色が付くように。とはいえ文字だから寒色で「文字列」と同じくらいの明るさに。

全体的には、あんまりビビッドな色とか逆にほんわかパステルは苦手なので、適度にくすみながら濁りすぎず、くっきりお互い見間違えないくらいのトーンを狙ってます。何年も使ううちに、その都度ちょっとずつ変えながら、今はこれに落ち着いてる。

あ、ちなみにデフォルトのシンタックスは Markdown にしてます。普通に使えば Plain Text みたいなもんだし、その上楽に見出しが作れる。

そして、その他表示に関わりそうな項目の設定はこんな感じです。

フォント
Menlo Regular 11pt
行間
0.25行
タブ/インデント幅
4
ウィンドウの透明度
0.95

フォントは前は Osaka 一等幅 でしたが新しくお目見えした Menlo がかわいいので宗旨替えしました。XcodeもMelnoだしね。癖がなく、可読性も良く、とてもコーディング向きです。Macの標準UIにも合うし、しかも独特の愛嬌がある。改めて考えてみると日本語部分は等幅じゃなくてもそんな困らないので、合成フォントとかではなくMenloを直で指定して済ませてます。強いて難を挙げると、□ とか ↵ とかの表示させている不可視文字が小さくなっちゃって若干見づらい。これはOsaka一等幅の方が良かったなぁ。

ウィンドウはそんなに透かしてません、気持ち。後ろに何かがあるがわかるくらい。あんま透けてても肝心のテキストが見づらいし、今はデュアルモニタなことが多いのでそんなに手狭でもない。

プレビュー

そしてこれらの設定で、実際の表示画面はこんな感じ。沢山色が使われてにぎやかなのでCSSに登場して頂こう。

[preview]

CSSだとことカラフル。HTMLなんかは基本的に キーワード, 値, 文字列の色くらいしか使われないので地味なのですが。まぁ、こんな感じ。あとはCotEditor用シンタックス定義の各シンタックス プレビューも、狭いけど現在の設定でのスクリーンショットです。HTMLのカラーリングは「HTML5'」を。ってかあの定義ファイルが単純に俺カスタム設定。

それと、ツールバーのアイコンの並びもずっとこれで使ってます。複数行の一括インデントは便利。こんな感じの コメントにする/はずす もあれば完璧なのになぁと思いつつ。

ないものは作ろう!の精神で自分で作りました→ CotEditor用 コメントマクロ

てな感じで、今はフォントと配色のおかげでわりかしかわいらしい、愉快な感じになっている。そいで見やすい。結構気に入ってます。

Comment

この記事へのコメント受付は終了しました。