[フォント] OSごとの游ゴシック体に関する覚書

OS にあるフォントファミリー

OS 搭載の游書体について
Windows や Macintosh の OS に搭載されている游書体フォントは弊社製品版とは一部異なります。

搭載フォント名や文字セット、製品版との互換性につきましては以下をご確認ください。
OS 搭載の游書体一覧 PDF > 字游工房｜ JIYUKOBO | OS 搭載の游書体について:

Windows

Windows 8.1

• 游ゴシック Light / Regular / Bold

Windows 10

• 游ゴシック Medium
• Yu Gothic UI

その他

Windows 7 ～ 8.1 においても、フォントパックで Windows 10 と同様の游ゴシックは使用可能

• Download 游ゴシック 游明朝フォントパック from Official Microsoft Download Center:

macOS

OS X 10.9 (Mavericks)

• 游ゴシック Medium / Bold

OS にインストールされているウェイト

各 OS にインストールされている游ゴシックのウェイト

CSS の font-weight と対応するウェイト

Windows で游ゴシックが細くなる問題

font-family: "Yu Gothic", YuGothic, sans-serif; /* Windows, macOS */

上記のようにフォントを指定すると、Windows は Regular、macOS は Medium が適応される。(font-weight:normal)

独自のフォントファミリーを定義する

@font-faceで環境依存を考慮したフォントファミリーを定義する。

@font-face {
  font-family: "YuGoMedium";
  font-weight: normal;
  src: local("YuGothic-Medium"), local("Yu Gothic Medium");
}

@font-face {
  font-family: "YuGoMedium";
  font-weight: bold;
  src: local("YuGothic-Bold"), local("Yu Gothic");
}

html {
  font-family: YuGoMedium, YuGothic, sans-serif;
}

Medium がない環境の場合は綺麗に表示ができないので、local("YuGothic-Regular")を追加する必要がある。