Содержание

Иногда понравившийся дизайн мы видим в интернете, журнале или даже на рекламной вывеске на улице, но определить шрифт самостоятельно не так просто. Хорошо, если вы узнали характерные особенности букв: в таком случае его легко найти. Но что делать, если вы встретились с ним впервые?

С текстом на сайте все проще: достаточно кликнуть правой кнопкой мыши и нажать «Посмотреть код». Выделив искомый фрагмент с загадочным шрифтом, можно отыскать строчку font-family и узнать его название. Если есть только картинка, на помощь приходят специальные сервисы.

Обзор сервисов для распознавания

Для отправки запроса достаточно иметь картинку.

Пример шрифта
Пример картинки для отправки запроса

Некоторые программы для распознавания шрифта могут воспринимать и менее качественные изображения.

Алгоритм работы получается следующим:

  1. Вы загружаете картинку в поисковое окно. Иногда можно вставить ссылку на изображение из интернета.
  2. После этого сервис даст возможность выделить интересующую область текста.
  3. На следующем этапе будут предложены варианты найденного текста. Стоит упомянуть, что большинство сервисов воспринимают текст на английском, поэтому лучше использовать слова с максимальным количеством латинских букв.
  4. Из представленных версий вы можете выбрать идентичную или похожие на нее варианты.
  5. Многие сайты предлагают сразу скачать шрифт, платно или бесплатно. Внимательно читайте условия лицензии, прежде чем его использовать. Даже у бесплатных шрифтов могут быть ограничения.

Перед тем как загрузить изображение, ознакомьтесь с краткой информацией о каждом сервисе и узнайте лайфхаки о работе в них.

WhatTheFont

Все еще самый популярный сервис, в библиотеке которого более 230 000 шрифтов. Он в основном распознает английские шрифты онлайн с картинки. Работает как в браузере, так и в качестве приложения на Android и iOS.

Есть только одно но: с 2023 года WhatTheFont не доступен в России и работает только с VPN.

Найти шрифт, похожий на картинку, в нем можно так:

Пример загрузки изображения на WhatTheFont
Загружаем изображение
Пример выделения текста на WhatTheFont
Выделяем текст
Пример готового результата на WhatTheFont
Получаем готовый результат

WhatFontIs

Данный сервис обладает расширенной библиотекой в 820 000 шрифтов, но определяет только английский. Вы сразу можете увидеть альтернативы, поставив в запросе поиск бесплатных шрифтов по изображению. Сервис автоматически разделяет буквы, выделяя их и убирая шум с картинки. Затем он предлагает опознать каждую из букв и выдает результат.

Пример загрузки изобажения на WhatFontIs
Загружаем изображение
Пример выделения текста на WhatFontIs
Выделяем текст
Пример оптимизации изображения на WhatFontIs
Оптимизируем изображение
Пример разделения текста на буквы на WhatFontIs
Разделяем текст на буквы
Пример готового результата на WhatFontIs
Получаем готовый результат

Font Matcherator от Fontspring

Если предыдущие сервисы по распознаванию шрифтов по картинке у многих на слуху, то Font Matcherator относительно новый. Его база насчитывает более 900 000 шрифтов. Внутри есть встроенный редактор, позволяющий вращать и обрезать изображение. Также можно сразу увидеть список лицензий и стоимость: почти всегда сервис выдает и бесплатные аналоги.

На этом сайте по поиску шрифтов есть собственное сообщество, где можно обсудить один из них или попросить помочь идентифицировать его. Библиотека включает и множество кириллических начертаний — это хороший сервис, чтобы распознать кириллический шрифт.

Работа в нем состоит из трех простых этапов.

Пример загрузки изображения на Font Matcherator
Загружаем изображение
Пример обработки и выделения текста на Font Matcherator
Обрабатываем и выделяем текст
Пример готового результата на Font Matcherator
Получаем готовый результат

Identifont

Это не совсем распознаватель шрифтов. Он предлагает найти один из подходящих по наводящим вопросам. В тесте предлагаются различные символы, после чего задаются вопросы о том, какие особенности имеют начертания букв. Также в Identifont можно найти похожий шрифт онлайн по названию исходника. Это одна из немногих программ, где можно искать символьные раскладки по словесным запросам.

Вот так выглядит стартовая страница сайта:

Стартовая страница Identifont
  • в первой левой колонке можно начать тест;
  • во второй — поиск по названию шрифта;
  • в третьей — подобрать похожие шрифты;
  • в четвертой — вбить слово и получить подборку символьных шрифтов;
  • в пятой — написать имя дизайнера или создателя шрифта для поиска похожего.

Fonts Ninja

Это не совсем программа, а расширение для браузера, совместимое с Google Chrome. Оно ищет шрифты только на сайте и подойдет для тех, кто не хочет разбираться в коде. Расширение не работает с картинками, только с текстом, который выделяется.

При включении расширения достаточно навести курсор на текст на сайте, после чего всплывет окно с размером и названием. Оно помогает распознавать текст независимо от языка.

Вот так выглядит расширение Fonts Ninja:

Расширение Fonts Ninja

Курс «Типографика: о форме и содержании»

Научитесь разбираться в классификации шрифтов, подбирать и комбинировать их. Получите доступ к «Дизайн-библиотеке» BBE.

Учиться ✨

Особенности определения кириллического шрифта

Мы уже упоминали о том, что многие онлайн-сервисы работают только с латиницей. Тогда можно распознать русский шрифт следующим методом:

  • загружаем туда «универсальные» буквы;
  • сервис показывает, какой латинский шрифт вы использовали;
  • после этого находите по картинке нужный русский шрифт, аналогичный латинскому.

Определить шрифт по изображению подобным образом можно на любом из сервисов, в том числе на WhatTheFont. Он частично распознает и шрифты на кириллице.

💥
Чтобы грамотно подобрать шрифт под продукт, донести до клиента идею и поддержать корпоративный стиль, нужно понимать основы верстки. Во всем этом поможет курс «Типографика и верстка: внимание к тексту».

Кстати, в нашем примере был использован шрифт Suisse.


Как максимально эффективно использовать сервисы для распознавания

Если вы все еще не теряете надежды найти похожие шрифты, а картинка плохого качества или ни один из сервисов ее не распознает, для вас советы ниже.

Мобильное приложение для распознавания

Можно скачать приложение WhatTheFont на iOS или Android, где функционал такой же, как на сайте. Не забудьте, что с 2023 года оно работает только через VPN.

Соблюдение требований к качеству изображений

Есть ряд правил, которые помогут осуществить поиск по картинке шрифта. В большинстве сервисов к изображению предъявляются следующие требования:

  • Размер должен быть меньше 275x360, а разрешение — более 600 точек на дюйм.
  • Определенный формат изображения, чаще всего — JPEG или PNG. Возможные варианты указаны на сайтах. При необходимости воспользуйтесь онлайн-конвертером.
  • У букв должен быть четкий контур. Хорошо, если они будут контрастировать с фоном — не все сервисы могут различить близкие оттенки. Прозрачный фон большинство программ не поддерживает.
  • Оптимальным будет фрагмент на 4 знака.

«Мне хотелось двигать пиксели, а не читать лекции»: как сменить профессию и не пожалеть
Выпускницы Bang Bang Education — о том, как решили сменить сферу деятельности
Читать далее

Что делать, если сервис не смог найти шрифт

Не всегда поиск шрифта заканчивается успешно. В таком случае попробуйте самостоятельно найти его в библиотеке шрифтов — Google, Adobe и не только. Также можно использовать символы, схожие и в английском, и в русском алфавите, если речь идет о кириллице. Найти изображение в лучшем качестве с четким контуром — тоже выход из положения.

Если и это не помогло, можно обратиться в сообщества, где дизайнеры и типографы помогут с подбором.


Сообщества, где помогут распознать шрифт

Существует множество сообществ, где помогут определить шрифт с картинки онлайн. Многие из них — англоязычные:

  • форум на сайте Whatthefont;
  • обсуждение TypeID на flickr.com;
  • Quora и Reddit — форумы, где люди распознают название по изображению;
  • чат телеграм-канала о графдизайне «ВBE: графический дизайн».

Курс «Типографика: о форме и содержании»

В работе со шрифтами нужно знать не только то, как расположить буквы, но и то, как воспримет их читатель. Освоите базовые принципы оформления текста, изучите историю и классификацию шрифтов, а также правила их сочетания.

Хочу учиться ✨
Поделиться