Google Notoフォント 設定 コピー用

Noto Sans Japanese（ゴシック）

HTML

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap" rel="stylesheet">

CSS

font-family: 'Noto Sans JP', sans-serif;

Noto Serif Japanese（明朝）

HTML

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;400;500;600&display=swap" rel="stylesheet">

CSS

font-family: 'Noto Serif JP', serif;

ゴシックと明朝 両方使うとき

HTML

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&family=Noto+Serif+JP:wght@300;400;500;600&display=swap" rel="stylesheet">

よく使うのに毎回調べてるのでここにメモ
近年メインがずーっとNotoSansなので
先日あえて游ゴシックを使ってみたら
新鮮でおしゃれに見えました(￣▽￣)
でも、明朝も見やすいしまだまだNotoメインになりそう