今日はAdobe社が開発したhtmlやcss・JavaScriptなどのコーディング用の無料フォント Source Han Code JP(源ノ角ゴシック Code JP)を、WindowsPCにインストールする方法について説明しますね。
『フォントのインストールなんてしたことないけど大丈夫かなぁ』という初心者さんでも、ちゃんとフォントのインストールできますのでご安心を。ゆっくりやって下さいネ。
それでは、Adobe社が開発したコーディング用の無料フォントSource Han Code JPを初心者がインストールする方法(Windows編)をはじめます……っと、その前に「Source Han Code JPって?」という人もいると思うのでその説明から行きますね。
Source Han Code JPって?
Source Han Code JPフォントは、Adobe社の日本語フォント開発チームに所属する服部正貴氏がつくった「コーディング用の見やすい&かっこいい&素敵な無料フォント」です。日本語名では源ノ角ゴシック Code JPになります。
つまり「Source Han Code JP = 源ノ角ゴシック Code JP」ということですね。ちなみに「源ノ角」の読み方は、「げんのかく」です。
Adobe社は、Illustrator(イラストレーター)・PhotoShop(フォトショップ)といったデザインのプロ達が使用するソフトウェアを作っている会社です。その会社がhtmlやcss・JavaScriptをはじめとするプログラミングのコーディング用フォントとして作ったので、当然オシャレ&クールです。しかも無料です。
それでは次にインストールをしていきましょう。
Source Han Code JPのインストール手順
それでは、Source Han Code JPフォントをインストールしていきましょう。
まずは公式サイトAdobe Fonts GitHubサイトにアクセスしましょう
アクセスすると、
これまでリリースされたSource Han Code JPフォントの各バージョンが、新しい順でならんでいます。
必要に応じてスクロールさせ、(OTF, OTC)と名前がついたリンクを探し、クリックします。上記の例で言うと Fonts version 2.012R (OTF, OTC)になります。なお2.012はバージョンです。バージョンアップすれば変わります。
というわけで(OTF, OTC)と名前がついたリンクをクリックして、
画面にある「Source code (zip)」をクリックして下さい。ダウンロードがはじまります。
[フォルダを開く]を選択し、ダウンロード先のフォルダを開きます。
ダウンロードしたzipファイルをクリックすると、エクスプローラに圧縮フォルダーツールが表示されるので、
圧縮フォルダーツールをクリックし、[すべて展開]をクリックします。
[完了時に展開されたファイルを表示する]にチェックが入っているのを確認し、[展開]ボタンをクリックします。
source-han-code-jp-2.012R(2.012はバージョンアップすると数字が変わります。)というフォルダができます。
そしてsource-han-code-jp-2.012Rフォルダをクリックすると、
OTFフォルダが表示され、
さらに、OTFフォルダとクリックすると、
「SourceHanCodeJP」という名前がついたファイルが14あります。これを一つ一つダブルクリックして、[インストール]ボタンを押せばOKなのですが、ちょっと大変ですよね。
ということで、楽をしましょう。まずスタートボタンから、[設定]をクリックし、
[設定の検索]に、フォントと入力すると、[フォント設定]が表示されるのでクリックすると、
[フォントの追加]が表示されるので、
拡張子がotfというファイルすべてを選択し、フォントの追加へドラッグアンドドロップをします。
しばらくまってインジケーターが消えたのを確認してください。下の方にスクロールさせると、源ノ角ゴシック Code JPが、インストールされているのが確認できます。
インストールはこれで終了です。
まとめ
今日はAdobe社が開発したhtmlやcss・JavaScriptなどのコーディング用の無料フォントSource Han Code JP(=源ノ角ゴシック Code JP)を、インストールする方法について説明しました。
『フォントのインストールなんて大丈夫かなぁ』という初心者さんでも、ちゃんとフォントをインストールできますのでご安心を。各テキストエディタで設定する方法は別記事でご紹介していますので、以下からどうぞ。



またAdobe社が開発し、2017年4月3日にリリースされた無料フォントSource Han Serif(=源ノ明朝)のインストール方法はこちらです。
