lisz-works

技術系だけど関係ないこと多い系ブログ

Tampermonkey エディタの見た目を変更する方法

【スポンサーリンク】

Chrome ロゴ

Tampermonkeyスクリプトのエディタの見た目を変更する方法です!

これでTampermonkeyも、白画面でコーディングから脱却できる!

手動で設定

まずは手動で設定する方法です。

  1. Tempermonkeyを開く
  2. 設定タブを選択
  3. 全般の「設定のモード」を「上級者」に変更

外観のUser CSSを編集する。

確認のために、例えばコレ↓を書いて保存ボタンを押します。

.CodeMirror-scroll {
  background: #000;
}

では、新規か適当なインストール済みスクリプトを開いて、エディタを開いてみましょう。

エディタ部分の背景が黒くなってませんか??

成功です!!

こんな感じで、CSSを編集して自力で表示をカスタムすることができます。

用意されたテーマを設定

用意されたテーマを設定する方法です。

  1. Tempermonkeyを開く
  2. 設定タブを選択
  3. 全般の「設定のモード」を「初心者」または「上級者」に変更

ページ中腹辺りの「エディター」欄を編集します。

Themeを変更すればエディタのカラーテーマが簡単に変更できます。

各テーマのサンプルを載せていきます。

規定

規定

Solarized

Solarized

Monokai

Monokai

mdn-like

mdn-like

Eclipse

Eclipse

RailsCasts

RailsCasts

ZenBurn

ZenBurn

あとがき

Tampermonkeyヘビーには使ってないけど、簡単に見た目が変更できるなら見やすい方がいいですよね!

みなさんも見やすいものに変更してみてはいかがでしょうか?