フォントファミリー設定 サンプルサイト集

参考にしているデザインのWebサイトが、どのようなフォントファミリーを設定しているかを紹介するページです。

サバが教えるレンサバ講座

サバが教えるレンサバ講座

font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Segoe UI", "メイリオ", "Meiryo",sans-serif;
フォントは、こんな風に見えるよ。

サルワカ

サルワカ

font-family: -apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Kaku Gothic ProN",YuGothic,"Yu Gothic",Verdana,Meiryo,sans-serif;
フォントは、こんな風に見えるよ。

PROUD 虎ノ門

PROUD 虎ノ門

font-family: "Times New Roman", Times, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "Sawarabi Mincho", "游明朝体", "Yu Mincho", YuMincho, "HG明朝B", serif;
フォントは、こんな風に見えるよ。

ピクスタ

ピクスタ

font-family: -apple-system, BlinkMacSystemFont, Lato, "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
フォントは、こんな風に見えるよ。