フォント検索ツールとは?
フォント検索ツールとは、画像に使われている書体を教えてくれるツールです。文字が写った画像を渡すと、文字の形を既知のフォントと比較し、最も近い候補を表示します。そのままダウンロードしたり、購入したり、代わりのフォントを選んだりできます。
このツールは、書体デザイナーのように文字を読むビジョンモデルを使っています。ピクセルだけでなく、セリフの形、太い線と細い線のコントラスト、小文字の高さ、「g」の尾や「R」の脚など、書体ごとの違いを生む細部に注目し、同じ特徴を持つフォントファミリーを挙げます。
画像からフォントを特定する方法
画像をアップロードし、文字を1行だけ切り抜いてフォントを判別を押し、候補を見比べるだけです。
画像を追加する
ドラッグ&ドロップ、スクリーンショットの貼り付け、ファイルの選択、スマホでの撮影のいずれかで追加します。大きな写真はアップロード前にブラウザで縮小されるので、モバイル回線でも快適です。
文字部分を切り抜く
1つの単語か1行を囲むように枠を描きます。アイコンや別のフォント、ごちゃごちゃした背景を除くのが、精度を上げるいちばんのコツです。
文字を読み取らせる
テキストを読み取り、スタイル(セリフ体、サンセリフ体、スクリプト体など)を判断し、特徴的な文字を比較して可能性の高いフォントを順に並べます。
比べてダウンロード
好きな言葉を入力して各候補をプレビューし、無料かどうかを確認して、DaFontStyleまたはGoogle Fontsから入手できます。
より正確に判別するコツ
正面から撮ったシャープな画像で、明るい背景に暗い文字が理想です。1種類のフォントの数語だけを切り抜き、文字が十分な大きさになるようにしましょう。
- 1種類のフォントだけを切り抜く。 見出しと本文は別のフォントであることが多いので、調べたい部分だけを選びましょう。
- 文字をまっすぐに。 回転・湾曲・遠近で歪んだ文字はどんなツールでも判別しにくくなります。正面から撮るか、先に画像をまっすぐに補正してください。
- 大きく写す。 スクリーンショットの前に拡大しましょう。文字の高さが100px前後あると、セリフや線の端がはっきり見えます。
- コントラスト不足を補う。 模様のある背景や派手な背景は文字の輪郭を隠してしまいます。コントラストを強調をオンにすると、くっきりしたグレースケールになります。
- 特徴的な文字を含める。 a、g、R、Q、k、y や数字はフォントごとの差が大きいので、これらを含む単語ほど判別しやすくなります。
- 書かれている文字を入力する。 デザイン性の高い文字なら、何と書いてあるかを入力すると読み取りと判別の助けになります。
判別できるフォントのスタイル
すべての結果はスタイルの判定から始まります。オリジナルの書体で完全一致がなくても、分類がわかれば似たフォントを探しやすくなります。
| スタイル | 見分け方 | 例 |
|---|---|---|
| セリフ体 | 線の端に小さな飾り(セリフ)があり、太い線と細い線の差があることが多い | Times New Roman, Garamond, Playfair Display |
| サンセリフ体 | 飾りがなく、線の太さが均一で、すっきりとモダンな印象 | Helvetica, Futura, Montserrat, Inter |
| スラブセリフ体 | 太く四角いセリフで、線の強弱が少ない | Rockwell, Roboto Slab, Arvo |
| スクリプト体 | ペンや筆で書いたような、つながった流れる文字 | Pacifico, Great Vibes, Lobster |
| 手書き風 | 実際の手書きのようなラフで不揃いな文字 | Caveat, Indie Flower, Amatic SC |
| ディスプレイ体 | 大きなサイズで使う、目を引く装飾的なデザイン | Bebas Neue, Impact, Cooper Black |
| 等幅 | すべての文字が同じ幅 | Courier New, JetBrains Mono |
| ブラックレター | 角ばった中世風のゴシック体 | Old English Text, UnifrakturMaguntia |
フォントを特定するほかの方法
画像から探す方法だけが選択肢ではありません。どこで文字を見たかによって、最適な方法は変わります。
| 方法 | 向いている場面 | 弱点 |
|---|---|---|
| 画像からのフォント検索(このページ) | 写真、スクリーンショット、ロゴ、ポスター、パッケージ、SNSの投稿 | オリジナルのレタリングは完全一致がなく、小さい文字やぼやけた文字は精度が下がる |
| 1文字ずつ照合するサイト | 1文字ずつ確認できるきれいなデジタルテキスト | 文字を1つずつ指定する手間がかかることが多い |
| ブラウザの開発者ツール | Webサイト上の実際のテキスト(右クリック →「検証」→ font-family を確認) | 画像・PDF・動画の中の文字には使えない |
| タイポグラフィのフォーラム | 珍しい書体、ヴィンテージ書体、手描きの文字 | 回答まで数時間から数日かかることがある |
フォント判別ツールを使うのは?
デザイナーは、クライアントのブランドに合わせたり、元データのない古いロゴを作り直したりするときに使います。小さなお店や企業は、メニューや看板、SNS投稿をロゴと統一するのに役立てています。クリエイターは気に入ったサムネイルやポスター、テロップのフォントを探し、開発者はデザインのスクリーンショットを、見た目が同じ無料Webフォントを使ったCSSに変換しています。
よくある質問
画像に使われているフォントはどうやって調べられますか?
DaFontStyleのフォント検索に画像をアップロードし、はっきりした1行の文字に切り抜いて「フォントを判別」を押してください。数秒で、一致するフォントの一覧、それぞれのプレビュー、無料の代替フォントが表示されます。
このフォント検索は無料ですか?
はい。完全無料で、アカウント登録も不要、透かしや1日の有料制限もありません。快適に使えるよう、1分あたり約10回のゆるやかな回数制限があります。
AIによるフォント判別の精度は?
人気のある書体で、きれいな横書きの文字なら、正しいフォントがたいてい上位に表示されます。極端に小さい、ぼやけた、歪んだ、装飾の強い、手描きの文字では精度が下がります。1行だけを狭く切り抜き、シャープな画像を使うと最も良い結果になります。
スマホで撮った写真からもフォントを判別できますか?
はい。スマホでは「写真を撮る」をタップするとカメラを直接使えます。文字と平行にスマホを構え、反射や影を避け、判別前に文字部分を切り抜いてください。
ロゴのフォントも判別できますか?
多くのロゴの書体を判別できます。特に商用フォントやGoogle Fontsで作られたロゴは得意です。オリジナルや加工された文字のロゴは完全一致しないことがあるため、その場合は最も近いフォントと無料のそっくりフォントを表示します。
手書き文字や筆記体フォントも判別できますか?
スクリプト体、カリグラフィー、手書き風フォントにも対応していますが、つながった文字は照合が難しくなります。短い単語を切り抜き、文字が欠けないようにし、コントラストの高い画像を使ってください。
アップロードした画像は保存されますか?
いいえ。画像はフォントを判別するためにメモリ上で処理されるだけで、保存・公開されたり、ギャラリー作りに使われたりすることはありません。このページではGoogleアナリティクスとAdSenseを使用していますが、画像がそれらと共有されることはありません。
対応している画像形式とサイズは?
JPG・PNG・WebP・GIFに対応しています。大きな写真はアップロード前にブラウザで自動的に縮小されるので、普通のスマホ写真やスクリーンショットなら問題なく使えます。
一致したフォントが無料でない場合は?
すべての結果に、そのフォントが無料か有料かが表示されます。有料フォントの場合は、個人・商用どちらのプロジェクトにも使える無料の代替フォント(主にGoogle Fonts)も提案します。
Webサイトのフォントを調べるには?
Webページ上の実際のテキストなら、文字を右クリックして「検証」を選び、「計算済みスタイル」パネルで font-family を確認します。画像・バナー・動画の中の文字は、スクリーンショットを撮ってフォント検索にアップロードしてください。
結果に出てくる書体用語
- セリフ
- 文字の主な線の端にある小さな飾りやウロコのような部分。
- エックスハイト
- 「x」のような小文字の高さ。エックスハイトが高いと、小さなサイズでも大きく読みやすく見えます。
- ストロークのコントラスト
- 文字のいちばん太い部分といちばん細い部分の差。
- ターミナル
- セリフのない線の終わり方。平ら、丸い、斜め、玉状などがあります。
- アパーチャー
- c、e、a などの、一部が閉じた空間の開き具合。
- ウェイト
- 線の太さ。Thin や Light から Bold や Black まであります。