クリスマスギフトはAmazonで選ぼう!

僕が恋したVSCodeのおすすめテーマ「Monokai Pro」は他とは違うぞ!

日頃からコードを書く方なら使っているであろうプログラミングエディタ。

その中にはフォントやテーマをこだわる人もいると思います。
そんな方に私がおすすめしたい配色テーマ見つけました。

この記事ではSublime TextやVSCodeで使える「Monokai Pro」というテーマを紹介します。

そもそもMonokaiってなに?

「Monokai」というカラースキーム(配色テーマ)はご存知ですか?

「Monokai」はWimer Hazenberg氏が制作したコードのカラースキーム(配色テーマ)です。

2006年に生まれ、その後Sublime Textがデフォルトのテーマとして採用し、
今では、どのエディタでもMonokaiが使えるようになり定番のテーマとなりました。

「Monokai Pro」も同じ人が作ったSublime TextとVSCode用のオリジナルのテーマです。
要するに、Monokaiを作った人が新しく作ったテーマってことになります。

Monokai Proってどんなテーマ?

Monokaiについて知っていただけたところで、本題に移ります。

私が推しているMonokai Pro、どういったテーマなのでしょうか。
ここからはMonokai Proの配色やファイルアイコンについて紹介します。

コード配色

コードの配色は目に優しい落ち着いた色になっています。
HTMLとJavaScript(React)の配色は以下の画像を参考してください。

(ソースコード引用 : https://github.com/dawnlabs/carbon)

6種類のMonokaiテーマを選べる!

なんとMonokai Pro、6種類の背景色を選ぶことができます。
若干、背景色によってコードの色も変わるようです。

Monokai Pro Themes

  • Pro (デフォルト)
  • Octagon
  • Ristretto
  • Spectrum
  • Machine
  • Classic

(出典 : monokai.pro)

ちなみに私は黒ベースのSpectrumを使っています。
各テーマのサンプルはMonokai Proのサイトで確認することができます。

リンク :
Monokai Pro for Visual Studio Code
Monokai Pro for Sublime Text

ファイルアイコンもオリジナル

Monokai Proには可愛らしいファイルアイコンも付いてきます。
主要言語のアイコンはあるものの、F#やPugといった言語のものはないようです。

(出典 : github.com/Monokai/monokai-pro-vscode)

スポンサーリンク

Monokai Proを使うためには

Monokai ProはVSCode、Sublime Text向けに提供されています。
インストール方法は他のテーマと同じですので、「Monokai Pro」と検索すればインストールできます。

Monokai Proのインストール方法

Monokai Proのインストール方法を各エディタごとに解説しています。

Sublime Textへインストールするには、Package Controlを導入する必要があります。
もしPackage Controlが導入できていない場合は、別途インストールお願いします。
リンク : Sublime Text – Package Control のインストール

まずメニューからPreferences ▶ Package Controlをクリック

次にPackage Controlが表示されたらInstall Packageをクリック

すると検索欄が出るので「Monokai Pro」と入力 ▶「Theme – Monokai Pro」をクリック

インストールが完了したらメニューから
Preferences ▶ Package Settings ▶ Theme – Monokai Pro ▶ Select Themeをクリック

するとテーマ一覧が表示されるので、お好みのものを選択して適用してください。

VSCodeへのインストールはSublime Textと違い、数クリックで可能です。

まずマイクロソフトが提供しているVisual Studio Marketplaceを開きましょう。
リンク : Monokai Pro – Visual Studio Marketplace

開けたら、まず「Install」というボタンをクリック

するとChromeを使っているとこのような表示が出ます。
別のブラウザでも別途違う表示がされますので、「開く」をクリック

するとVSCodeが開くので、そこからインストールを完了しましょう。

インストールが完了したら、エディタ右下の設定マークをクリック
すると以下のようなメニューが出るので、「配色テーマ」をクリック

あとはMonokai Proを探して、お好みのテーマを選択して適用してください。

ライセンスを購入しよう

Monokai Proは無料で使うことができますが、たまに「ライセンス買ってね」と宣伝が出ます。
そのポップアップを非表示にするためには、ライセンスを購入する必要があります。

Sublime Textのようにライセンスがない場合、ポップアップが表示されるようです。
ですが永久試用版として無料で使い続けることもできます。

価格は9.95ユーロ、日本円で約1300円程度で購入できます。
気に入った方は是非購入をしてみてくださいね。

購入にはPayPalアカウントが必要です。

まずMonokai Proのサイトを開きます。
リンク : Monokai Pro

次にライセンスを購入したいエディタを選んでクリック
Sublime TextとVSCode、ライセンスは別々に購入する必要があります。

選択したエディタのページの下のほうに「Buy license」があるのでクリック

すると決済ページが表示されるので、「Pay with Paypal」をクリック
PayPalのサイトが開くので決済を行ってください。

決済が終わると、決済したPayPalのメールアドレス宛てにライセンスキーが届きます。
メールに記載された手順でライセンスキーを各エディタで有効にしてください。