プロフィールページが新しくなりました

僕が恋した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のメールアドレス宛てにライセンスキーが届きます。
メールに記載された手順でライセンスキーを各エディタで有効にしてください。