コードが見やすく使いやすいSublime Text 2/3のテーマのまとめ

シンプルで見やすく、Web制作時などのコーディング作業が捗る使いやすいSublime Text 2や3のテーマを紹介します。使い慣れたエディタもテーマを変えると新鮮な気持ちになりますよね。

まずは、最近リリースされたSublime Text 2/3のテーマから。
テーマファイルをインストールする方法や日本語化は、一番下にまとめました。

テーマのキャプチャ

El Capitan (ST3 対応)

OS X Yosemiteにインスパイアされた明るいカラーをベースにしたテーマ。

テーマのキャプチャ

Seti_ST3 (ST3 対応)

ファイルタイプごとのカラフルなアイコンが使いやすいテーマ。
最近は、このテーマがお気に入りです。

テーマのキャプチャ

Zenburn (ST2/3 対応)

長時間のコーディング作業でも目に優しいカラーが素敵なテーマ。
勝負の時は、カラースキームにこれを使ってます!

テーマのキャプチャ

Reeder (ST2 対応)

RSSリーダー「Reeder」っぽい優美なカラーがいい感じです。
ZenburnとReederを切り替えて使ってて、テキスト主体の時にはこっち。
※ST2用ですが、「Packages」にテーマファイルを直接置くことでST3でも利用できます。サポートはされていないので自己責任で。

テーマのキャプチャ

Fizzy (ST2/3 対応)

Laravelのシンタックスのカラーを参考にしたSodaベースのテーマ。

ここから下は、定番テーマや人気テーマをご紹介。

テーマのキャプチャ

Soda (ST2/3 対応)

Dark, Lightの2種類のカラーが用意されており、すっきりしたUIは多くのテーマファイルのベースにもなっています。

テーマのキャプチャ

Spacegray (ST2/3 対応)

Eighties Dark, Ocean Dark/Lightが用意されており、そのミニマルなUIはファンが非常に多いテーマです。

テーマのキャプチャ

Nexus (ST2/3 対応)

アクセントにNexusのカラーを使ったダーク系のテーマ。

テーマのキャプチャ

flatland (ST2/3 対応)

フラットにデザインされたテーマで、サイドバーがとても分かりやすいです。

テーマのキャプチャ

itg.flat (ST2/3 対応)

Retinaにも非Retinaディスプレイにも対応したフラットなテーマ。

テーマのキャプチャ

Toy Chest (ST2/3 対応)

カラフルなカラーがおもちゃっぽいかわいいテーマ。

テーマのキャプチャ

Farzher (ST2/3 対応)

Web制作者が使いやすいようデザインされたテーマ。Bright, Dark, Neonの3種類を用意。

テーマのキャプチャ

Tomorrow (ST2 対応)

夜をイメージした4+1種類のカラーを備えたテーマ。

テーマのキャプチャ

Freesia (ST3 対応)

パープルを多めに使ったダーク系のローコントラストのテーマ。これが見やすいという人にはたまらないカラーリングです。

テーマのキャプチャ

Aprosopo (ST2/3 対応)

カラー、タブ、サイドバーなどカスタマイズ性を備えたテーマ。

テーマのキャプチャ

Focus (ST2/3 対応)

インラインのテキストを編集する時に集中するためのテーマ。HTMLだけでなく、Markdownにもその威力を発揮します。カラーはダークの他に、ライトもあります。

Sublime Text 2/3の日本語化

Sublime Text 2/3のメニューを日本語化します。

テーマのキャプチャ

Japanize (ST2/3 対応)

Package Controlから「Japanize」をインストールし、その後表示される説明に従ってファイルを移動して利用します。
※Package Controlの説明は、下記に。

Sublime Textにテーマファイルをインストールする方法

テーマのインストール方法は、主に2種類あります。

  • Package Controlでインストール(コマンドベースの作業、慣れると楽)
  • zipファイルでインストール(ダウンロードファイルを設置、安心で簡単)

Package Controlでインストール

まずは、Package ControlをSublime Textにインストールします。

  1. Sublime Textのメニュー [View - Show Console]でコンソールを表示します。
  2. Installation -PackageからSublime Text 2または3用のコードをコピーして、コンソールにペーストして、Enterキーを押します。
  3. メッセージが表示され、Sublime Textを再起動して、完了です。
  4. 完了すると、メニュー [Tools]から「Command Pallete」が利用できるようになります。

Package Controlからテーマをインストールします。

  1. Sublime Textのメニュー [Tools - Command Pallete]でコマンドパレットを表示します。
  2. 「Package Control: Install Package」を選択します。
  3. テーマを指定します。
    Spacegrayだと「Theme - Spacegray」を指定し、Enterキーを押します。
  4. これでインストールは、完了です。

テーマとカラーをアクティブにするには、下記の手順です。

  1. Sublime Textのメニュー [Preferences - Settin-User]を選択し、設定ファイルを開きます。
  2. 設定ファイルに、各テーマ用のコードを記述し、再起動するばテーマが反映されます。
    Spacegrayだと、下記のようになります(※各テーマごとにコードが異なります)。
{
  "theme": "Spacegray.sublime-theme",
  "color_scheme": "Packages/Theme - Spacegray/base16-ocean.dark.tmTheme"
}

zipファイルでインストール

Package Controlを触るのが怖い人は、こちらが安全です。

  1. テーマファイルをダウンロードし、解凍します。
  2. 解凍したフォルダは、必要があればリネームをします。
    リネームは「Theme - テーマ名」で、Spacegrayは「Theme - Spacegray」にします。
  3. フォルダをSublime Text内の「Packages」フォルダ内に移動します。「Packages」フォルダは、メニュー [Preferences - Browse Packages」で表示できます。
  4. Sublime Textを再起動します。

カラーをアクティブにするには、下記の手順です。

  1. Sublime Textのメニュー [Preferences - Color Scheme]にインストールしてテーマが表示されているので、そこから選択します。

top of page

©2017 coliss