The Japanese Web Fonts v7.2.0現在のフォント一覧。
フリーフォントで恐らく最も重宝されているゴシック体フリーフォント。AdobeとGoogleが共同で開発し、Adobeからは「源ノ角ゴシック（日本語名）・Source Han Sans（英語名）」、Googleからは「Noto Sans JP」という名前でリリースされている。
| font-family | SourceHanSans-w |
| 利用可能なfont-feature-settings指定 | palt |
| URL | https://github.com/adobe-fonts/source-han-sans/ |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/SourceHanSans/SourceHanSanscss |
| ExtraLight | 100 |
| Light | 200 |
| Normal | 300 |
| Regular | 400 |
| Medium | 500 |
| Bold | 700 |
| Heavy | 800 |
Source Han Sansと同じく、AdobeとGoogleが共同で開発し、Adobeからは「源ノ明朝（日本語名）・Source Han Serif（英語名）」、Googleからは「Noto Serif JP」という名前でリリースされている。
| font-family | SourceHanSerif-w |
| 利用可能なfont-feature-settings指定 | palt |
| URL | https://github.com/adobe-fonts/source-han-serif/ |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/SourceHanSerif/SourceHanSerifcss |
| ExtraLight | 100 |
| Light | 200 |
| Regular | 400 |
| Medium | 500 |
| SemiBold | 600 |
| Bold | 700 |
| Heavy | 800 |
有名な日本語角ゴシックフリーフォント。
このセットでは、欧文4書体と日本語2書体、共通する記号をそれぞれ別の書体とすることで効率化を図っている。
ここの指定では、mplus-c-w, mplus-1-w, mplus-S-wを指定して「M+ 1C」で表示している。
それぞれの書体についてはこちらを参照。
| font-family | mplus-c-wmplus-p-wmplus-m-wmplus-mn-wmplus-1-w(日本語1mplus-2-w(日本語2)mplus-S-w(記号) |
| URL | https://mplus-fonts.osdn.jp/ |
| Liscense | M+ Fonts License |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/mplus-*/mplus-*.css*をc,p,mmn,1,2,Sに置き換えてください。 |
MおよびMNにはheavyとblackがない。
| thin | 100 |
| light | 200 |
| regular | 400 |
| medium | 500 |
| bold | 700 |
| heavy | 800 |
| black | 900 |
アドオンフォントはベースフォントと違う部分だけ収録しているため、ベースフォントを別途追加で指定する必要があります。（NasuとNasuMは例外）
和風な角ゴシックフォント。
| font-family | irohakakuC-w, SourceHanSans-w |
| URL | http://modi.jpn.org/font_irohakakuc.php |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/irohakakuC/irohakakuC.css |
| ExtraLight | 100 |
| Light | 200 |
| Regular | 400 |
| Medium | 500 |
| Bold | 700 |
最近街中でよく見かけがちな（？）ロゴフォント。
| font-family | corporateLogo-w, SourceHanSans-w |
| URL | http://logotype.jp/corporate-logo-font-dl.html |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/corporateLogo/corporateLogocss |
| medium | 500 |
| bold | 700 |
ポップ体（ウェイトは800を指定）
| font-family | LiNovePOP-w, SourceHanSans-w |
| URL | http://www.fontna.com/blog/1706/ |
| Liscense | M+ Fonts License |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/LiNovePOP/LiNovePOP.css |
ポップ体（ウェイトは800を指定）
| font-family | KeiFont-w, SourceHanSans-w |
| URL | http://font.sumomo.ne.jp/font_1.html |
| Liscense | Apache License 2.0 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/KeiFont/KeiFont.css |
子どもっぽいゴシック仮名
| font-family | Boku2Gothic-w, SourceHanSans-w |
| URL | https://fontopo.com/?p=94, https://fontopo.com/?p=98 |
| Liscense | Apache License 2.0 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/Boku2Gothic/Boku2Gothic.css |
| Regular | 400 |
| Bold | 700 |
子どもっぽいゴシック仮名
| font-family | BokuGothic-w, SourceHanSans-w |
| URL | https://fontopo.com/?p=164 |
| Liscense | IPAフォントライセンスv1.0 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/BokuGothic/BokuGothic.css |
漫画の本文で使われるアンチゴチ体（ウェイトは500を指定）
| font-family | GenEiAntique-w(共通)GenEiAntique-N-w(かな)GenEiAntique-P-w(かなプロポーショナル) |
| URL | http://okoneya.jp/font/genei-antique.html |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/GenEiAntique/GenEiAntiquecsshttps://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/GenEiAntique-*/GenEiAntique-*.css*はP,Nに置き換えてください。 |
| font-family | GenEiLateGo-w(共通)GenEiLateGo-N-w(かな)GenEiLateGo-P-w(かなプロポーショナル) |
| URL | http://okoneya.jp/font/genei-latin.html |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/GenEiLateGo/GenEiLateGocsshttps://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/GenEiLateGo-*/GenEiLateGo-*.css*はP,Nに置き換えてください。 |
仮名を大振りにするなどした、漫画向けの太ゴシック（ウェイトは800を指定）
| font-family | GenEiNuGothic-w, SourceHanSans-w |
| URL | https://okoneya.jp/font/genei-nu-gothic.html |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/GenEiNuGothic/GenEiNuGothic.css |
日本語フォントと混植しても違和感がないようにしたHindベースの英数ゴシックフォント
| font-family | GenEiUniverSans-w, SourceHanSans-w |
| URL | https://okoneya.jp/font/download.html |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/GenEiUniverSans/GenEiUniverSanscss |
| L | 200 |
| SL | 300 |
| R | 400 |
| SB | 600 |
| B | 700 |
| H | 800 |
| Bk | 900 |
「えれがんと」と一緒に使える欧文フォント（font-faceで指定されているウェイトは900だが、ここでは700を指定）
| font-family | GenEiRomanNotes-w |
| URL | https://okoneya.jp/font/genei-romanotes.html |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/GenEiRomanNotes/GenEiRomanNotes.css |
ディスプレイ向けのフォント
| font-family | Nasu-w |
| URL | http://itouhiro.hatenablog.com/entry/20140917/font |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/Nasu/Nasu.css |
| Regular | 400 |
| Bold | 700 |
ディスプレイ向けの等幅フォント
| font-family | NasuM-w |
| URL | http://itouhiro.hatenablog.com/entry/20140917/font |
| Liscense | SIL Open Font License 1.1 |
| CSS | https://cdn.jsdelivr.net/gh/tamaina/[email protected]/dist/NasuM/NasuM.css |
| Regular | 400 |
| Bold | 700 |