フォントの指定(scss)

google font

https://fonts.google.com/?preview.text_type=custom
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap');
$font-family-en: 'Montserrat', sans-serif ;
$font-family-ja: "游ゴシック", sans-serif ;

body{
    font-family:$font-family-ja;
    color: #3e3e3e;
}

sassの場合は変数が使えるので
英語の場合は$font-family-en
日本語の場合は$font-family-ja
などで使い分けることができる。

フォントの変更があった場合も
変数部分を変更するだけでいいので
保守性に優れている。

この記事をシェアする