印刷
サンフランシスコ (SF) は、すべての Apple プラットフォームのシステムフォントです。SF Pro バリアントは、macOS のシステムフォントです。システムフォントを使用すると、テキストの読みやすさ、明瞭さ、および Apple プラットフォーム全体のアプリとの一貫性が得られます。サンフランシスコのフォントファミリーを ここ からダウンロードしてください。
macOS 11 以降、システムはサンフランシスコのフォントを 可変 フォント形式で提供しています。この形式は、異なるフォントスタイルを 1 つのファイルに結合し、スタイル間の補間をサポートして中間スタイルを作成します。補間を使用すると、書体はすべてのサイズに適応しながら、各サイズ用に特別にデザインされたように見えます。
補間によりまた、光学サイジングも可能になり、これは、さまざまなサイズに合わせてさまざまな活版印刷デザインを作成することを意味します。macOS 11 以降では、システムフォントは 動的光学サイズ をサポートし、個別の光学サイズのテキストと表示を単一の、連続したデザインに合併させます。このデザインにより、各グリフまたは字体を補間して、ポイントサイズに正確に適合した構造を作成できます。
注意
以前のバージョンの macOS で実行されているデザインツールで可変フォントを使用すると、予期しない結果が生じる可能性があります。この場合、引き続き テキストと表示 を使用してください。
可能な限り、組み込みのテキストスタイルを使用してください。 macOS 11 以降では、組み込みのテキストスタイルを使用して、最適な読みやすさを維持しながら、視覚的に区別できる方法でコンテンツを表現できます。たとえば、プライマリコンテンツには Body のテキストスタイルを使用し、ラベルと二次コンテンツには 脚注とキャプション のテキストスタイルを使用します。以下の表で、各スタイルのウエイト、サイズ、線の高さ、および強調された太さを示します。開発者向けガイダンスについては、NSFont.TextStyle (NSFont.TextStyle) を参照してください。
テキストスタイル | ウエイト | サイズ(ポイント) | 線の高さ (ポイント) | 強調のウエイト |
大タイトル | 普通 | 26 | 32 | 太い |
タイトル 1 | 普通 | 22 | 26 | 太い |
タイトル 2 | 普通 | 17 | 22 | 太い |
タイトル 3 | 普通 | 15 | 20 | やや太い |
大見出し | 太い | 13 | 16 | 非常に太い |
中見出し | 普通 | 11 | 14 | やや太い |
本文 | 普通 | 13 | 16 | やや太い |
コールアウト | 普通 | 12 | 15 | やや太い |
脚注 | 普通 | 10 | 13 | やや太い |
キャプション 1 | 普通 | 10 | 13 | 中字 |
キャプション 2 | 中字 | 10 | 13 | やや太い |
@2x デザインの 144ppi の画像解像度に基づくポイントサイズ。
読みやすさを向上させるか、スペースを節約するために先頭を変更します。 先頭 は、テキスト行間のスペースです。場合によっては、このスペースを増減すると、テキストレイアウトがより適切に機能します。幅の広い列や長い文章でテキストを表示する場合、行間のスペースを増やすと (先頭がゆるくなります)、ある行から次の行に移動するときに場所を維持しやすくなります。逆に、高さが制限されている領域 (たとえば、リスト行) に 2 行のテキストを表示する必要がある場合は、行間のスペースを減らす (先頭をきつくする) と、テキストをうまく収めることができます。3 行以上のテキストを表示する必要がある場合は、高さが制限されている領域でもきつい先頭を避けてください。システムは、行間のスペースを 2 ポイント増減できる API を定義します。開発者向けガイダンスについては、loose と tight (SwiftUI) および looseLeading (looseLeading) と tightLeading (tightLeading) (AppKit) を参照してください。
重要な情報を強調します。 フォントのウエイト、サイズ、色を使用して、あなたのアプリで最も重要な情報を強調します。
あなたのインターフェイスで使用する書体の数を最小限に抑えます。 あまりにも多くの異なる書体を混在させると、あなたのアプリは断片化されてずさんなように見えます。
カスタムフォントが読みやすいことを確認してください。 カスタムフォントは macOS でサポートされていますが、読みにくい場合があります。ブランド化や没入型のゲーム体験を作成するなど、あなたのアプリにカスタムフォントが必要な場合を除いて、通常はシステムフォントを使用するのが最適です。カスタムフォントを使用する場合は、小さいサイズでも読みやすいことを確認してください。
ユーザのフォントを変更するには、標準の [フォント] パネルを使用します。 あなたのアプリがタイポグラフィとテキストレイアウトをサポートしている場合は、カスタムフォントピッカーをデザインするのではなく、標準の [フォント] パネルを使用してユーザのフォントを選択します。[フォント] パネルは人々に馴染みがあり、フォントを選択したり、書体、サイズ、色などの属性を調整したりするためのコントロールが含まれています。開発者向けガイダンスについては、NSFontPanel (NSFontPanel) を参照してください。
動的システムフォントバリアントを使用して、標準コントロールのテキストの外観に一致させます。 動的システムフォントバリアントは、標準のシステムが提供するコントロールに表示されるテキストと同じルックアンドフィールをテキストに提供します。これらのバリアントを使用して、プラットフォーム上の他のアプリと一貫性のある外観を実現します。
動的フォントバリアント | API |
コントロールコンテンツ | controlContentFontOfSize |
ラベル | labelFontOfSize |
メニュー | menuFontOfSize |
メニューバー | menuBarFontOfSize |
メッセージ | messageFontOfSize |
パレット | paletteFontOfSize |
タイトル | titleBarFontOfSize |
ツールチップ | toolTipsFontOfSize |
書類テキスト(ユーザ) | userFontOfSize |
等幅書類テキスト(ユーザ固定ピッチ) | userFixedPitchFontOfSize |
太字のシステムフォント | boldSystemFontOfSize |
システムフォント | systemFontOfSize |
インターフェイスのモックアップで必要に応じて追跡を調整します。 実行中のアプリでは、システムフォントがすべてのポイントサイズで追跡を動的に調整します。可変システムフォントを使用する UI の正確なインターフェースモックアップを作成するためには、特定のポイントサイズで個別の光学サイズを選択する必要はありませんが、追跡を調整する必要があります。この状況では、以下にリストされている SF Pro 追跡値を使用するか、Apple Design Resources を参照してください。
(訳注:以下、数字だけの表が長く続いている。日本語に訳す意義はないので、最初の項目の日本語訳だけを載せる。詳しくは こちら まで)
サイズ(ポイント) | 追跡値(1/1000 em) | 追跡値(ポイント) |