Google Fontsのフォントを、サイズ・色・背景を指定してテストできる「Type Hero」

SEROの嫁です。主に裏方担当。
夫のアシスタントをしたり、ブログに投稿したりしています。
2級ウェブデザイン技能士。

ウェブサイト制作の強い味方、Webフォントの「Google Fonts」。
公式サイトでは、4種類の背景色を変更することができる程度で、詳細なテストはできません。

「Type Hero」は、豊富なGoogle Fontsを、好きな文字列・文字色・背景色で試せるというツールです。

使い方

Type Hero のサイトを開くと、広い画面の中央にテキストが入力できるようになっています。ここに好きな文字を入力して…

テキストを入力

左のパネルで、試したいフォントを選びます。

フォントを選ぶ

そして、文字色・背景色をカラーピッカーから選ぶだけ。カラーコードでの指定も可能です。

文字色・背景色

色はあらかじめ用意されたパレットから選ぶこともできます。

パレット

テキストはかなり長めのものでも入力できるので、イメージがつかみやすいですね。

長めのテキスト

シンプルなツールですが、手軽にデザインイメージを確認できるので便利ですよ!