-apple-systemは、和文フォントを少し小さく表示する 427 views Post TeaTea @teatea1024 09 Sep, 2024 12:01 +00:00 Last edited 09 Sep, 2024 12:04 +00:00 CSSのfont-familyに-apple-systemを入れ、Appleのデバイスを利用してこの-apple-systemが効いている状態で日本語のWebサイトを見ると、和文が少し小さいフォントサイズで表示されます。つまり、-apple-system では12ptを指定しても和文フォントは12ptで表示されません。 ということで、Figmaなどのデザインツールで決めたフォントサイズをそのまま指定すると-apple-system では少し小さく表示される点には注意が必要です。 ちなみに、-apple-systemが何故このようなことになっているかというと、一般に欧文フォントより和文フォントを少し小さく表示した方が文字サイズのバランスが良いと言われているので、欧文フォントとの文字サイズのバランスを取ったためだと思われます。 Write Preview How to write in Markdown
TeaTea @teatea1024 09 Sep, 2024 12:01 +00:00 Last edited 09 Sep, 2024 12:04 +00:00 CSSのfont-familyに-apple-systemを入れ、Appleのデバイスを利用してこの-apple-systemが効いている状態で日本語のWebサイトを見ると、和文が少し小さいフォントサイズで表示されます。つまり、-apple-system では12ptを指定しても和文フォントは12ptで表示されません。 ということで、Figmaなどのデザインツールで決めたフォントサイズをそのまま指定すると-apple-system では少し小さく表示される点には注意が必要です。 ちなみに、-apple-systemが何故このようなことになっているかというと、一般に欧文フォントより和文フォントを少し小さく表示した方が文字サイズのバランスが良いと言われているので、欧文フォントとの文字サイズのバランスを取ったためだと思われます。
CSSのfont-familyに-apple-systemを入れ、Appleのデバイスを利用してこの-apple-systemが効いている状態で日本語のWebサイトを見ると、和文が少し小さいフォントサイズで表示されます。つまり、-apple-system では12ptを指定しても和文フォントは12ptで表示されません。
ということで、Figmaなどのデザインツールで決めたフォントサイズをそのまま指定すると-apple-system では少し小さく表示される点には注意が必要です。
ちなみに、-apple-systemが何故このようなことになっているかというと、一般に欧文フォントより和文フォントを少し小さく表示した方が文字サイズのバランスが良いと言われているので、欧文フォントとの文字サイズのバランスを取ったためだと思われます。