タイポグラフィ

書体は、Rimoの印象をつくる大切な要素です。
一貫したビジュアルコミュニケーションを保つため、原則として以下の書体を使用してください。
やむを得ず別の書体を使用する場合は、Rimoのデザインチームまでご相談ください。

欧文

Primary書体には DIN Next 79 を採用しています。
DIN Next 79は、無駄のない構造と高い視認性を備えた書体です。
洗練された印象を保ちながら可読性にも優れ、デジタル環境やUIにおいて安定したパフォーマンスを発揮します。デザインシステムとの整合性も高く、正確な情報伝達が求められる場面に適しています。

English|Primary

Main headlines
DIN Next 79 Bold
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 1234567890 !?@#$%&()_:;><-
Sub headlines
DIN Next 79 Medium
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 1234567890 !?@#$%&()_:;><-
Text & Captions
DIN Next 79 Regular
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 1234567890 !?@#$%&()_:;><-

Secondary書体には Inter を採用しています。
Interは、高い可読性と明瞭な視認性を備えた書体です。
スクリーン上での表示に最適化されており、小さなサイズでも安定した読みやすさを保ちます。
デジタル環境やUIにおいて一貫した表現を実現し、正確な情報伝達を支えます。

Secondary

Main headlines
Inter Bold
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 1234567890 !?@#$%&()_:;><-
Sub headlines
Inter Medium
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 1234567890 !?@#$%&()_:;><-
Text & Captions
Inter Regular
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 1234567890 !?@#$%&()_:;><-

和文

日本語書体には 源ノ角ゴシック を採用しています。
源ノ角ゴシックは、安定した可読性とバランスの取れた字形を備えた書体です。
日本語を含む多言語環境に対応し、デジタルから紙面まで幅広い場面で一貫した表現を実現します。
視認性と信頼感を兼ね備え、正確な情報伝達を支えます。

Japanese

Main headlines
Sub headlines
Text & Captions

使用上の注意

上述の書体を使用なさる際は、以下のような使用方法は避けてください。

Don’t | フォントの縦横比を変更しない
Don’t | 罫線を巻くなどしながら、ウェイトを無理やり太くしない
Don’t | 斜体にしない
Don’t | Font対して、影などの装飾を過度に付与しない

基本方針

書体は、Rimo の印象をつくる大切な要素です。一貫したビジュアルコミュニケーションを保つため、原則として以下の書体を使用してください。やむを得ず別の書体を使用する場合は、Rimo のデザインチームまでご相談ください。

  • English|Primary: DIN Next 79(Main headlines: Bold / Sub headlines: Medium / Text & Captions: Regular)
  • English|Secondary: Inter(同上のウェイト構成)
  • Japanese: 源ノ角ゴシック(同上のウェイト構成。Web 配信実体は Noto Sans JP)
  • Guidance(禁止 4 例): 縦横比の変更 / 罫線等でウェイトを無理やり太らせる疑似ボールド / 斜体 / 影など過度な装飾

コミュニケーションデザイン領域(LP、名刺、プレゼン資料、ブランドサイト等)と、プロダクト内で使用するフォントを使い分ける。書体を増やさず、ウェイトと大きさで情報の階層をつくる。

コミュニケーションデザイン領域

用途フォントウェイト配信
欧文(表示)DIN Next(D ネクスト / Monotype)Regular 400 / Medium 500 / Bold 700FONTPLUS
欧文(補助・本文)InterRegular 400 / Medium 500 / Semibold 600 / Bold 700Google Fonts
和文源ノ角ゴシック(Source Han Sans)Regular 400 / Medium 500 / Bold 700Google Fonts(Noto Sans JP として配信)

書体の名称について

「源ノ角ゴシック」と「Source Han Sans」と「Noto Sans JP」は、Adobe と Google が共同開発した同一の書体の異なる呼称です。本ガイドラインでは:

  • ブランド呼称: 源ノ角ゴシック(Source Han Sans)
  • Web 配信実体: Noto Sans JP(Google Fonts 経由)

を使い分けます。サイトおよびプロダクトの CSS では "Noto Sans JP" を font-family に指定して問題ありません。

文字サイズ(コミュニケーション領域)

役割サイズ書体 / ウェイトletter-spacingline-height
Display48–88pxDIN Next Bold-3%1.02
H136–56pxDIN Next Bold-2.5%1.10
H236pxDIN Next Medium-1%1.15
Headline JP32pxSource Han Sans 60001.35
Body16pxInter / Noto Sans JP 40001.75
Caption12pxInter Medium0.14em1.40

プロダクト内

システムフォント(SF Pro / DIN 2014 / ヒラギノ等)の運用を継続する。

代替フォント

FONTPLUS のスクリプトが読み込めない環境向けに、以下のフォールバックを設定する。

/* 例 */
font-family:
  "DIN Next", /* FONTPLUS(モノタイプ) */
  "Barlow",   /* 近似フォールバック */
  "Inter",
  system-ui,
  sans-serif;

和文は "Noto Sans JP" をフォールバックとして使用可能。

Copied!