サムネイル_フォント検索できる便利なツール

デザイナーのykです!

デザインプロセスにおいて、適切なフォント選びは重要でデザイン全体の印象にも大きく影響します。
しかし、使いたいフォントが見つからなかったり、素敵なフォントが見つかったけど名前がわからなくて困ったり、なんてことがあるかと思います。(そもそも、フォントを探すのも大変な作業ですよね…汗)
そこで今回この記事では、フォントの特定に役立つ便利なツールを7つご紹介します。


結論からいってしまうと、各ツールごとに特徴が異なるので、ニーズや使い勝手の良さから自分に合ったツールを見つけることが大切です。記事の最後に今回ご紹介するツールを一覧でまとめています!
ぜひ参考にしていただけたら嬉しいです。

Webページ内のフォントを検索できるツール

Webページで利用されているフォント名は、ディベロッパーモードなどでソースコードを見て確認できます。しかし、Webやプログラミングの知識がなければ、ソースコードの勉強からしなければならず苦戦することもあるかと思います。そんなときでも、知識不要で簡単にフォントを特定できるツールがあります。

① WhatFont

WhatFont_image

出典:WhatFont


「 WhatFont 」は、Webページで使用されているフォントを特定するためのブラウザ拡張機能の1つです。Googleアカウントがあれば、誰でも無料で利用できるのでブラウザにインストールしておくのがオススメです!

Webサイト上で、マウスをフォントが適用されているテキストの上に合わせる(マウスオーバー)だけでフォントファミリーがわかり(図:左下)、さらにクリックすることでスタイル、ウェイト、カラー、スタイルなどの詳細情報を表示することもできます(図:右下)。

Webやプログラミングの知識がなくても簡単に調べることができるため、駆け出しのデザイナーやエンジニアでも使いやすいツールになっています。

WhatFont_image02

画像でフォントを検索できるツール

画像をアップロードすることでフォントを解析するツールです。画像がぼやけていたり、歪んでいたりすると正確な結果が得られないので、高品質な画像を用意することが大切です。

② What font is

What Font is_image01

出典:What Font Is


「 What Font Is 」は、画像をアップロードすることで、同じフォントや似ているデザインのフォントを検索することができるツール※です。
※英字フォントのみ対応しており、日本語フォントは検索できないので注意が必要です。

画像をアップロードして「FIND THE FONT」をクリックするだけでフォント検索が開始。素早くフォントを探すことができます。

What Font is_image02

③ Likefont

LikeFont_image

出典:Likefont


「 Likefont 」も、画像をアップロードすることで、似たデザインのフォントを検索することができるツールです。
似ている度合いがパーセンテージ(%)で表示されるので、より近いフォントデザインを比較しながら、フォントを探すことができます。
こちらは日本語フォントにも対応しているので、「What Font Is」とは異なるメリットがあります。

④ Adobe Illustrator

Adobe Illustlator_image

出典:Adobe Illustrator


「 Adobe Illustrator 」は、テキストと画像を組み合わせてデザインを作成できるアプリです。
その中のフォント検索機能「フォントの再編集(Retype)」はフォント名※を調べることができます。
「Retype」では文字を含む画像だけでなく、アウトライン化されたテキストも検索することが可能になっています。
※Retypeのフォント検索の対象となるフォントはAdobe Fonts収録フォントのみのため注意が必要です。


こちらの記事で簡単に「フォントの再編集(Retype)」のやり方をご紹介していますので、ぜひ併せてご覧ください!

Adobe MAX2023キーノートで発表された新機能から注目のものをご紹介&実際に使ってみた!

スマートフォンで撮影してフォント検索できるツール

お持ちのスマホのカメラ機能を使用して、テキストを読み取り、フォントを検索することができるツールです。
ソースコードをチェックしたり、画像をアップロードしたりすることなく、簡単にフォントを調べることができるので便利です。

⑤ Adobe Capture

Adobe Capture_image

出典:Adobe Capture


「 Adobe Capture 」は、Adobeが提供する写真や画像をクリエイティブな素材に変換するなど多機能なスマートフォンアプリです。その中の一つであるフォント検索は、アプリ内のカメラでテキストを撮影してそのテキストに最も近いフォントを見つけることができる機能です。
スマートフォン1台あれば気軽に調べることができるので、街中の広告・看板などの気になるフォントを見つけたときに利用してみるのが良いでしょう。

 

書体や印象・イメージからフォント検索できるツール

フォントの持つ特徴(書体)から調べたり、制作するプロジェクトの雰囲気にあわせたりと主観的な印象やイメージを基に検索することができるツールです。

⑥ モジザイ

モジサイ_image

出典:モジザイ


「 モジザイ 」は、書体やイメージワードでフォントを検索できるツールです。書体(文字の形)と「男性的」「モダン」「フォーマル」「シンプル」といったイメージワードからフォントを絞り込むことができます。
プレビュー機能があり、実際の文字列から雰囲気や印象を確認することもできます。
商用利用可能なフォントが多くあり、簡単に利用することができます。しかし、フォントを利用する際は配布元サイトに記載されている利用規約を遵守することが大切になります。

⑦ FONT BEAR

FONT BEAR_image

出典:FONTBEAR


「 FONTBEAR 」は、商用利用可能なフリーフォントを検索するためのツールです。
和文フォントと欧文フォントの両方に対応しているので幅広くフォントを探すことができます。また、絞り込み機能では、フリーワード検索、カテゴリ(和文と欧文)、タグ(特徴)が同時検索できるので、より詳細にフォントを絞り込むことができます。
フォントが画面全体にわたって一覧表示されているため、見た目の印象で比較しやすく、選びやすいのもポイントです。

まとめ

いかがでしたでしょうか?
ツールによって検索方法、和文・欧文対応しているかなど違いがありました。ですので、これらのツールを複数試し、自分にあったツールを活用してみるのがいいと思います。
個人的には、⁩「①WhatFont」のディベロッパーモードでソースコードを確認せずとも、拡張機能でフォント詳細をチェックすることができるのでオススメです!(綺麗に作成されたWebサイトを見るとどんなフォント使っているんだろうって気になってしまいますし…)
今回ご紹介した7つのツールについてまとめたので、こちらもぜひ参考にしてみてください。

フォント検索ツール

フォントの特定はデザインプロセスにおいて重要です。これらのツールを駆使して、効率的に最適なフォントを見つけましょう!

 

ソニックムーブは一緒に働くメンバーを募集しています

Wantedlyには具体的な業務内容のほかメンバーインタビューも掲載しております。ぜひご覧ください。

 

あわせて読みたい記事