VS CodeでAdobe Fontsのフォントを表示する方法

Visual Studio Code(VS Code)でAdobe Fontsのフォントを表示する方法を教えます。プログラミング用フォントに変更したい、より見やすいフォントを利用してコーディングしたいという人におすすめの内容です。


{tocify} $title={Table of Contents}

無料配布中！当サイトの運営者Natchanが制作したフリー素材を『イラストAC』にて無料でDLできちゃいます( ^o^)⊃―☆{codeBox}

VS CodeでAdobe Fontsの利用方法

まず、VS CodeではOSのデフォルトフォントが表示されていますが、Adobe Fontsにあるプログラミング用フォントの方がずっと見やすいです。

おすすめのプログラミング用フォントは以下の記事で解説しています↓

プログラミング用フォントを日本語＆英語で厳選〈コーディングにおすすめ〉

プログラミング用のフォントを日本語版も含めてAdobe Fontsから厳選しました。コーディング向けのフォントを知りたい、プログラミングに適したおすすめのフォントを探しているという人におすすめの内容です。

www.live-to-design.com

それでは、設定のやり方を説明します。フォントの変更はとても簡単です。

STEP1:フォントをアクティベート

Adobe Fontsで利用したいフォントのページを開いたら、アクティベートしてください。

STEP2：VS Codeの設定画面を開く

フォントサイズも変更可

左下の歯車アイコンから、設定→テキストエディタ―→フォント→Font Familyに移ります。3つほどフォントがすでに設定されていると思います。

表示したいフォント名を1番最初に入力してください。私が使っているフォントはHackです。すごく見やすいのでおすすめ！

STEP3：VS Codeを再起動する

再起動すればちゃんと反映される

フォント名を入力したらVS Codeを再起動すれば完了です。ちなみに、設定→テーマから好みの背景色に変更できます。私が使っているのはTomorrow Night Blueです。

最後に｜Adobe Fontsをフル活用

以上、VS CodeでAdobe Fontsのフォントを表示する方法を教えました。

Adobe Fontsは無料会員でも使えますが、利用可能なフォントに限りがあります。フル活用するには、Creative Cloudにあるどれかのプランを契約すればすべて解禁されます。

Adobe Fontsですべてのフォントを使う方法〈商用利用可〉

Adobe Fontsにあるすべてのフォントを使う方法を教えます。世界中の優秀なフォントメーカーが制作した高品質なフォント(商用利用可)が数多く提供されるAdobe Fontsをビジネスでフル活用したい事業者、商用利用OKのフォントでロゴをデザインしたいデザイナー、Adobe...

www.live-to-design.com

Adobe製品以外のソフトでもAdobe Fontsを同期できるのがとても便利ですよね。

最後までお読みいただきありがとうございました。以下にプログラマー向けのおすすめ記事を載せているので、ぜひチェックしてみてください。


　You may also like : 

• プログラマー向けポートフォリオにおすすめのWordPressテーマ
• アイキャッチがないWordPressテーマを厳選〈サムネなし〉
• FigmaのダッシュボードUIテンプレートを厳選〈商用利用可〉
PR 初心者でも安心！たった10分で出来るWordPressブログの始め方