Fontyは、サイトにGoogle Fontsを適用した場合の見た目をプレビューできるWEBサービスです。
指定したサイトにGoogle Fontsを適用して、サイトとフォントの調和具合を確認できます。
Fontyの使い方
Fontyにアクセスして、上部のサイトのURLを入力します。Enterでサイトが読み込まれます。
![URLの入力](https://techmemo.biz/wp-content/uploads/2019/05/fonty1-636x400.png)
左側のフォント一覧から、適用したいフォントを選択しましょう。右側のプレビューに、リアルタイムでフォントが適用されます。
![フォントの適用](https://techmemo.biz/wp-content/uploads/2019/05/fonty2-641x305.png)
検索ボックスにフォント名を入力するか、[FILTER BY]でフォントの種類を選択すると、フォントの絞り込みができます。
![フォントの絞り込み](https://techmemo.biz/wp-content/uploads/2019/05/fonty3-219x400.png)
適用したいフォントが決まったら、右上の[Download]をクリックします。
![フォントのダウンロード](https://techmemo.biz/wp-content/uploads/2019/05/fonty4-550x400.png)
[Download]をクリックすると、「Hosted by Google」か「Download」を選択できます。
![フォントダウンロードの選択](https://techmemo.biz/wp-content/uploads/2019/05/fonty5-641x350.png)
Hosted by Googleを選択するとGoogle Fontsのフォントページ、Downloadを選択するとフォントのダウンロードページへ移動します。
あとがき
Google Fontsをサイトに適用する時は、事前にFontyを使って試しておくと「やっぱり何か違う」といったギャップを感じることがなくなりますね。
Google Fontsの導入を検討している方は、ぜひご活用ください。