なんてフォント?わからないフォント名を検索できちゃうサービスをご紹介!

なんてフォント?わからないフォント名を検索できちゃうサービスをご紹介!

街を散策している時。
雑誌を見ている時。
webサイトを閲覧している時に、このフォントかっこいいなあ。
「なんてフォントなんだろう…?」「あのデザインに使いたいなぁ…。」
でもフォント名が分からないしなあ。と思ったことはないですか?

どもども~。デザイナーのyamaです。
生活する中で、いつか使えるかもというアイデアを、いろいろな場面で探してしまう私…(職業病w)

今回は、2つのフォント検索サービスのご紹介です!

①「WhatTheFont」(画像をアップするだけでフォントをピックアップしてくれる)
②「WhatFont」(カーソルをあわせるだけでフォント名を調べられる)

WhatTheFontの使い方

①サイトにアクセスして画像をアップロード

WAhatTheFont」(←こちらからアクセスしてください。)
表示されたこちらに画像をドラック&ドロップして数秒おまちを!

WhatTheFontサイトイメージ画像

②フォーカスの調整

数秒待つとフォントがフォーカスされるので、フォーカス部分を調整してください。(パースかかってるんですが、ちゃんと読み取ってくれました!)

フォントフォーカスされた状態のイメージ画像

③矢印をクリック

矢印をクリックして数秒待つと…。

④似たフォントが表示されます

似たフォントをチョイスしてくれますよ。
文章も拾ってくれる…!この精度感動しますね。

しかも、ピックアップしてくれたフォント購入もできちゃいます!
この画像は有料フォントばかりですが…フリーフォントも検索対象なので安心してください!

気になったフォントの写真をアップロードするだけで、認識して検索してくれるなんて!
新たなフォントに巡り合うきっかけにもいいですよね。

WhatFontの使い方

続いては、web上のデバイスフォントの情報を取得してくれるChromeの拡張機能「WhatFont」をご紹介します!

インストールをしておけば、フォント名、フォントサイズ、フォントカラーがカーソルを置くだけで調べられちゃいます!(なんと素晴らしい!)めっちゃ使いますコレ!かなり助けられてます^^

イメージソースとしてサイトを閲覧している時に「なんかいいなこのフォント」→クリック!「○○○っていうんだ。覚えておこう!」と情報をストックしたり、「この文字のジャンプ率、見ていて気持ちいいな」と思った時にフォントサイズを確認してバランス感覚を磨いてみたり。更新デザイン制作時に「このサイトのリンク色の数値っていくつだっけ?」とパパっと調べられたり。

ネタ集めにも、製作時の手間を軽減できたり、微々たるもんですが…。
私の中では、痒いところに手が届くステキな存在です。

①サイトにアクセスしてインストール

chromeの拡張機能「WhatFont」ダウンロードページ

WhatFont」(←こちらからアクセスしてください。)

②アイコンをクリック

インストールするとこちらに表示されるので一度「クリック」してください。

アイコンをクリック。イメージ画像

③調べたいフォントにカーソルを合わせます

フォント検索時のイメージ画像

フォント名だけなら、カーソルを合わせるだけでOK。
もっと詳しい情報を知りたい場合は、フォント上をクリックすると、こんな画面が表示され、フォントサイズ、カラー、ウエイト、行間まで表示されるんです!難点といえば、テキストリンク上でクリックすると高確率で別ページへ飛ばされます。(うまい具合にクリックすると情報表示できるんですけど、なかなか難しい^^;)

④アイコンクリックで終了

調べるモードを解除するには、アイコンをもう一度クリックするだけ。
簡単でしょ?



まとめ

英字の画像検索なら、「WAhatTheFont」で検索。
日本語の画像検索があれば完璧なんですけどね…。
まだ見つけられていません…;

デバイスフォントの検索はChromeの拡張機能の「WhatFont」で!

簡単便利なサービスなので、気になった方は一度お試しあれ〜
でわでわ〜。デザイナーのyamaでした!