モリサワ Webフォントの利用

目次

Webフォントを使用する

使用するフォントを設定するには、HTML と CSSを編集します。

■ HTML を編集する

Webフォントを使用したい HTML ファイルの HEAD タグの </head> 直前に以下のコードを記述します。

<script type="text/javascript" src="//code.typesquare.com/static/kagoya/kagoya.js"></script>

■ CSS を編集する

Webフォントを使用したい箇所へ「font-family」を使って、日本語または英語のどちらかでフォント名を指定します。

font-family: "リュウミン R-KL";

または

font-family: Ryumin Regular KL;

【記述例】

<span style="font-family: Ryumin Regular KL;">テキスト</span>

設定できるフォントは以下の通りです。

書体分類 フォント名(日本語) フォント名(英語) 書体見本
明朝体 リュウミン R-KL Ryumin Regular KL 見本
リュウミン M-KL Ryumin Medium KL 見本
A1明朝 A1 Mincho 見本
ゴシック体 新ゴ R Shin Go Regular 見本
新ゴ M Shin Go Medium 見本
見出ゴMB31 Midashi Go MB31 見本
ゴシックMB101 B Gothic MB101 Bold 見本
A1ゴシック M A1 Gothic M 見本
ナウ-GM NOW-GM 見本
丸ゴシック体 じゅん 201 Jun 201 見本
じゅん 501 Jun 501 見本
デザイン書体 フォーク R Folk Regular 見本
フォーク M Folk Medium 見本
丸フォーク R Maru Folk Regular 見本
丸フォーク B Maru Folk Bold 見本
はるひ学園 Haruhi Gakuen 見本
シネマレター Cinema Letter 見本
G2サンセリフ-B GSanSerif-B 見本
カクミン R Kakumin Regular 見本
トーキング Talking 見本
すずむし Suzumushi 見本
みちくさ Michikusa 見本
黒曜 Kokuyo 見本
装飾書体 新ゴ 太ライン Shin Go Futoline 見本
筆書体 教科書ICA R Kyoukasho ICA Light 見本
UD書体 UD新ゴ R UD Shin Go Regular 見本
UD新ゴ M UD Shin Go Medium 見本
UD新ゴ コンデンス90 L UD Shin Go Conde90 L 見本
UD新ゴ コンデンス90 M UD Shin Go Conde90 M 見本
UD新ゴ コンデンス70 M UD Shin Go Conde70 M 見本

目次

一覧から探す