コーディング用フォント「Moralerspace」がリリース!Monaspaceベースで読みやすい

プログラミングにおいて、読みやすいコードは美しいだけでなく、バグの少ない効率的な開発につながります。そのためには、適切なフォントの選定も欠かせません。
今回は、最近公開されたばかりのプログラマー向けフォント「Moralerspace」について、その特徴や魅力を深堀りします。
Moralerspaceフォントとは?

Moralerspaceは、モダンな欧文フォント「Monaspace」と、日本語フォント「IBM Plex Sans JP」を組み合わせた、プログラミング向けのフォントです。この組み合わせにより英数字と日本語の文字が美しく調和し、読みやすさと使いやすさを両立しています。
Moralerspaceは、同じくプログラミング用フォントの「HackGen」と同じ方が開発しています。
MonaspaceはGitHubが開発したフォントで、さまざまな技術によって読みやすさを実現しています。詳しくは、こちらの記事で解説しています。

Moralerspaceの特徴
Moralerspaceフォントは、Monaspace由来の英数字を使っているため、クリアでモダンなデザインで非常に読みやすくなっています。また、日本語文字はIBM Plex Sans JPをベースにしており、文字の懐が広く、長時間のコーディング作業でも目の疲れを軽減します。
文字幅比率は半角3:全角5で、ゆとりのある幅の半角英数字を実現しています。半角1:全角2のバージョンも配布されています。さらに、全角スペースが可視化されるため、バグの減少にも寄与します。
ライセンス
MoralerspaceフォントはSIL Open Font License v1.1に基づいて配布されています。これにより、個人使用から商用利用まで、自由に使用することが可能です。
使い方
MoralerspaceはGitHubリポジトリーのReleasesページからダウンロードできます。[Assets]から好みのバージョンのZIPファイルをダウンロードし、解凍してフォントをインストールするだけです。
VS Codeで使うには、GUIから設定するか、settings.jsonを編集します。たとえば、通常版のMoralerspaceのNeonを利用する場合は、GUIでフォント設定の先頭に'Moralerspace Neon',を追加するか、settings.jsonを次のように編集します。
{ // ... "editor.fontFamily": "'Moralerspace Neon', monospace"}Moralerspace Neonの部分は、ダウンロードしたフォントのファミリー名に置き換えてください。たとえば、Moralerspaceの半角1:全角2バージョンのArgonを使う場合は、Moralerspace Argon HWとします。
まとめ
Moralerspaceは、MonaspaceとIBM Plex Sans JPの良いところを組み合わせた非常に読みやすいフォントです。筆者もさっそくVS CodeのフォントをMoralerspaceに設定しました。ぜひ、試してみてください。
参考
記事をシェア
フォローして最新情報を入手
Googleの優先ソースに追加すると、このサイトの記事をGoogleで見つけやすくなります。また、ぜひXやRSSフィードもフォローしてください。
-1.png&w=1080&q=75)
生まれた時から、母国語よりも先にJavaScriptを使っていました。ネットの海のどこにもいなくてどこにでもいます。
Webフロントエンドプログラマーとして、TypeScriptを用いたWebアプリやブラウザー拡張機能を制作。Xのシャドウバン検知ツール「Shadowban Scanner」やリンクカード復活ツール「Restore Link Card」を公開し、国内外のメディアで紹介されました。iGEM 2023ではJapan-UnitedチームのWikiを制作してGrand Prizeの獲得に貢献。ブログではXやSNSの最新ニュース、不具合の検証と対処法、フロントエンド開発の知見を発信しています。




![[新しいXチャットへようこそ]というテキストが画面に大きく表示されており、その下には次の3つの説明が表示されている。[エンドツーエンドの暗号化:メッセージは、端末にかかわらずエンドツーエンドで暗号化されています。][最先端のプライバシー:Xを含め、他の人がメッセージを読むことはできません。][パスコードを設定:メッセージを保護するため、4桁のパスコードを設定してください。]これらの説明の下には、[パスコードを作成]という大きなボタンが配置されている](/_next/image/?url=%2Fapi%2Fmedia%2Ffile%2Fwelcome-to-new-chat.png&w=1920&q=75)

![[何を報告していますか?]というタイトルのダイアログで[スパム]にチェックが入っているスクリーンショット](/_next/image/?url=%2Fapi%2Fmedia%2Ffile%2Fx-report-post-spam-selected.png&w=1920&q=75)

![Xの設定の[アクセシビリティ、表示、言語]>[表示]>[フォントサイズ]のスクリーンショット](/_next/image/?url=%2Fapi%2Fmedia%2Ffile%2Fx-android-font-size-settings.png&w=3840&q=75)
![画面中央に[Codex]というテキストが配置されており、その下に[Sign in with ChatGPT]というボタンが表示されている画像](/_next/image/?url=%2Fapi%2Fmedia%2Ffile%2Fcodex-sign-in-with-chatgpt.png&w=1920&q=75)
![npmのパッケージの設定画面のスクリーンショット。[Trusted Publisher]セクションの[Select your publisher]に[GitHub Actions]と[GitLab CI/CD]の2つのボタンが表示されている](/_next/image/?url=%2Fapi%2Fmedia%2Ffile%2Fnpm-trusted-publishing-settings.png&w=3840&q=75)
![[MCP Servers]というツールチップが表示されたボタンのスクリーンショット](/_next/image/?url=%2Fapi%2Fmedia%2Ffile%2Fcline-mcp-server-button.png&w=640&q=75)
