Google Fonts + 日本語を使用して、Webサイトやブログがどのように表示されるか試すことができるツール -Fonty

2018年9月にGoogle Fontsは日本語が正式にサポートされ、既に利用されている人、検討されている人も多いと思います。当ブログでも早期アクセスから使用しています。
日本語の正式サポートに伴い、Google Fontsを使用したさまざまなツールも日本語が利用できるようになりました。

自分のWebサイトやブログに、Google Fonts + 日本語を使用するとどのように表示されるか試すことができるオンラインツールを紹介します。

サイトのキャプチャ

参考: Google Fonts + 日本語

Google Fonts + 日本語でどのように表示されるかテスト

Google Fonts + 日本語を使用するとどのように表示されるか試すことができるオンラインツールはこちら、Fontyです。
登録など面倒なことは一切不要で、無料で利用できます。

サイトのキャプチャ

Fonty

Webフォントを簡単に試すことができるツールです。
まずは、左端のピンクのタブから「Titles」「Main」を選択し、左パネルからフォントを指定します。フォントは一覧でも表示されますが、検索機能を使用する方が簡単です。

ちなみに、選択したフォントは上部の「Download」からダウンロードできます。

サイトのキャプチャ

使用するフォントの指定

フォントを指定したら、試したいページのURLを上部に入力します。

サイトのキャプチャ

試したいページのURLを入力

これで、完了です。
あとは、左パネルからフォントを変更するだけで、いろいろなGoogle Fonts + 日本語を試すことができます。

サイトのキャプチャ

M PLUS 1pでコリスを表示

サイトのキャプチャ

M PLUS Rounded 1cでコリスを表示

サイトのキャプチャ

さわらびゴシックでコリスを表示

サイトのキャプチャ

さわらび明朝でコリスを表示

サイトのキャプチャ

Noto Sans JPでコリスを表示

Google Fonts + 日本語の使い方

Google Fonts + 日本語は、下記から利用できます。

サイトのキャプチャ

Google Fonts + 日本語

現在利用できる日本語フォントは、9種類。
2018年11月現在、5種類が正式版、4種類が早期アクセスになっています。

サイトのキャプチャ

使用できるフォントの一覧

Google Fonts + 日本語をWebサイトやブログで利用したい時は、下記フォントのコードをコピペするだけでOKです。

サイトのキャプチャ

M PLUS 1p

例えば、M PLUS 1pだと下記のようになります。

sponsors

top of page

©2018 coliss