Chrome拡張機能「WhatFont」でWEBサイトのフォント名が丸分かり！

こんにちは。

WEBデザインを考えている時に、「このサイトのこの文字ってフォントは何使ってるんだろう？」とか気になることありますよね。いつもお世話になっているWEBブラウザ搭載のディベロッパーツールを使ってソースを確認すればすぐに分かるんですが...

正直、めんどくせえ！！

そんな時に便利なのがGoogleChromeの拡張機能「WhatFont」です。

f:id:kotafujishiro:20151203211916p:plain

ダウンロードは非常に簡単。Googleウェブストアからお使いのGoogleChromeに機能を追加するだけです。

使い方も非常に簡単。まずは、GoogleChromeに追加されたWhatFontをクリックしてWhatFontを起動させます。その後、Chromeで開いているウェブサイトの文字にカーソルを合わせてクリックすると文字のフォントやサイズなどの詳細情報が表示されます。

試しに、ヤフーのトップページの文字を調べてみました。

f:id:kotafujishiro:20151203211919p:plain

ヤフーのトップページの文字はだいたいArial-regularなことが分かります。フォントと一緒にカラーコードやFontSize、Lineheightも一緒に取得できるのも地味に便利ですね。

ただ、たまに上手く機能しなかったり、違うフォントを表示させたりもしているようなので、ざっと確認した後に気になる部分に関してはディベロッパーツールなどを使って最終確認するのが良いかもしれないですね。

「WhatFont」のダウンロードは以下のリンク先からどうぞー。

ウェブと猫と東京で。