Crayon Syntax Highlighter のフォント一覧

こんにちは。安慶名勇子（アゲナユウコ）です。

先日、Crayon Syntax Highlighter のテンプレートを一覧にした記事をアップしたのですが、自分好みのデザインを選びやすくなって重宝しています。

2020.04.11

Crayon Syntax Highlighterのテンプレート一覧と背景色別一覧

プログラムコードをWordPressに美しく掲載するなら、Crayon Syntax Highlighterというプラグインがおすすめなのですが、テンプレートが豊富すぎて、どのデザインにしようか迷ってしまいます。 設定画面ではプレビューを見ながらテ...

せっかくなので、コードのフォントもアレンジして、サイトとの親和性を高めたいと思います。

コードに使用するフォントの変更は、Crayon Syntax Highlighter の設定欄で簡単にできるのですが、こちらも一覧では表示されないため、ひとつずつ検証する必要があります。

フォント14種類、背景58種類となると、トータルで812種類もの組み合わせは膨大すぎる…。ということで、背景が白のパターンと、黒のパターンでイメージを作成してみましたので、フォント選びの参考にどうぞ。

使用している背景は、Vs2012 と Vs2012 Black です。イメージ図の左下にあるのがフォント名です。

Contents

• 1 背景白（Vs2012）の場合のフォント一覧
• 2 背景黒（Vs2012 Black）の場合のフォント一覧

背景白（Vs2012）の場合のフォント一覧

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

背景黒（Vs2012 Black）の場合のフォント一覧

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• WordPress, プラグイン

ピックアップ記事

1. まるでパスタ専門店の味！「青の洞窟 ボロネーゼ」に嵌っています
2. 電子ペーパー・クアデルノ（A4サイズ）の購入を決めた理由

関連記事

1. 

   WordPress

   Table of Contents Plus：特定の記事のみ目次を非表示にする方法

   Wordpressの目次機能の代表的プラグインである Table of…

2. 

   WordPress

   Crayon Syntax Highlighterのテンプレート一覧と背景色別一覧

   プログラムコードをWordPressに美しく掲載するなら、Cra…

3. 

   WordPress

   WordPress で目次を自動作成！Table Of Contents Plus の設定方法

   ブログにおいての『目次』って、飲食店でいうお品書きと似ていると感…

4. 

   WordPress

   WordPressでサイトマップを簡単に作成する方法

   今回はサイトマップのお話を。インターネット用語の『サイトマップ』…

5. 

   WordPress

   Table of Contents Plus の目次が画面からはみ出る現象を解決

   Table of Contents Plus というプラグインを…

6. 

   WordPress

   「サイトに重大なエラーがありました」の解消方法

   WordPressにてホームページを運用されている方の相談に乗っ…