<link href="https://fonts.googleapis.com/earlyaccess/mplus1p.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/earlyaccess/roundedmplus1c.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/earlyaccess/hannari.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/earlyaccess/kokoro.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/earlyaccess/sawarabimincho.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/earlyaccess/sawarabigothic.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/earlyaccess/nikukyu.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/earlyaccess/nicomoji.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/earlyaccess/notosansjapanese.css" rel="stylesheet" />




<p class="wf-mplus1p">M+ 1pという日本語webフォントのデモです。</p>

<p class="wf-roundedmplus1c">Rounded M+ 1c
 という日本語webフォントのデモです。</p>

<p class="wf-hannari">はんなり明朝
 という日本語webフォントのデモです。</p>

<p class="wf-kokoro">こころ明朝
 という日本語webフォントのデモです。</p>

<p class="wf-sawarabimincho">さわらび明朝
 という日本語webフォントのデモです。</p>

<p class="wf-sawarabigothic">さわらびゴシック
 という日本語webフォントのデモです。</p>

<p class="wf-nikukyu">ニクキュウ
 という日本語webフォントのデモです。</p>

<p class="wf-nicomoji">ニコモジ
 という日本語webフォントのデモです。</p>

<p class="wf-notosansjapanese">Noto Sans Japanese
 という日本語webフォントのデモです。</p>
* {
  background-color: #3b3f47;
  color: #fff; 
  font-size: 18px;
  text-align: center;
}

.wf-mplus1p { font-family: "Mplus 1p"; }

.wf-roundedmplus1c { font-family: "Rounded Mplus 1c"; }

.wf-hannari { font-family: "Hannari"; }

.wf-kokoro { font-family: "Kokoro"; }

.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }

.wf-sawarabigothic { font-family: "Sawarabi Gothic"; }

.wf-nikukyu { font-family: "Nikukyu"; }

.wf-nicomoji { font-family: "Nico Moji"; }

.wf-notosansjapanese { font-family: "Noto Sans Japanese"; }

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.