Пошук шрифту на малюнку: надзвичайно прості способи від сервісів до додатків. WhatTheFont — визначаємо шрифт на малюнку Як дізнатися який використовувався шрифт

Зараз я вас навчу поганого.

Припустимо, є картинка

і потрібно знайти шрифт, яким зроблено напис, або підібрати схожий за стилем та характером.

Пошук за картинками

Йдемо в пошукові системи і пробуємо знайти джерело зображення, використовуючи пошук за картинкою.

https://www.google.ru/imghp?hl=ru

Вихідну картинку завантажуємо через форму або кидаємо на сторінку пошуку перетягуванням.

Часом Яндекс відпрацьовує краще за Гугла.

https://yandex.ru/images/

Користь від пошукових систем є такою.

Якщо ми знайдемо джерело, наприклад, логотипу, то зможемо знайти автора і, можливо, його портфоліо, а в ньому - вказівка ​​на використані шрифти. Або просто на сторінці десь поруч із зображенням буде написано назву шрифту.

Хто знає, це справа така. Шанси малі, але не настільки, щоб їх ігнорувати. Тим більше у безвихідній ситуації.

Що за шрифт на MyFonts.som

Ідемо на Майфонтс у розділ, де працює спеціально навчений робот.

http://www.myfonts.com/WhatTheFont/

Ми роботу картинку, він нам – шрифти. Ну чи нічого.

Але не поспішайте надіслати йому картинку без перевірки та доопрацювання. Врахуйте, що:
Робот не розуміє кирилицю.Перед завантаженням видаліть із зображення всі символи, яких немає в латиниці. Кирилічні символи, що збігаються з латинськими, можна залишити.
У робота поганий зір.Іноді плутає літери з нестандартними формами. Тому іноді краще годувати його за однією літерою. Варто знайти найхарактернішу і почати з неї.

Після завантаження скоригуйте розпізнані символи, ввівши в комірки під зображеннями правильні символи.

Якщо літера або знак (наприклад, оклику) розвалилася на два осередки, перетягніть одну картинку на іншу і зберіть літеру назад.

Тиснемо Continue.

Робот намагатиметься знайти оригінал шрифту та запропонує відповідні теги для подальшого самостійного пошуку.

Пошук за ключовими словами на MyFonts.som

У полі пошуку вбиваємо англійською слово чи словосполучення, яке визначає інструмент малювання, характер шрифту або його класифікацію.

Наше зображення виконане фломастером (brush pen). Ще тут підійдуть слова на кшталт «каліграфія» (calligraphic), «від руки» (handwritten) тощо. Тут можна скористатися тегами, які запропонував робот.

Можна шукати терміни окремо або об'єднувати їх і комбінувати в одному запиті.

Якщо обов'язково потрібна підтримка української чи іншої мови, то вказуємо відповідні налаштування в полях розширеного пошуку, відсікаючи сміття в результатах.

Тиснемо кнопку Search і переглядаємо результати, попутно відзначаючи для себе відповідні варіанти на заміну.

На Майфонтсі багато варіантів заміну вихідному шрифту.

Так, на Майфонтсі шрифти платні. Але ж безглуздо купувати цілу гарнітуру, якщо треба зробити короткий напис із кількох символів для тестування у своєму проекті.
Знаходимо потрібний варіант і збільшуємо область перегляду прикладу максимум. В окремих випадках можна ще зробити зум у браузері.

Скрине.

Растр

У Фотошопі скрін перетворюємо на смарт-об'єкт.У смарт-об'єкті накладаємо на нього Gradient Mapвід потрібного кольору до білого.

У макеті виставляємо смарт-об'єкту режим накладання шарів, наприклад, Multiply.

Для більшості випадків із білим тлом цього достатньо.

Кому цього мало, можете видалити зі скрина білий колір. Color Range…, тикаєте піпеткою в білому тлі

отримуєте виділення за кольором, інвертуєте виділення,

згладжуєте його пару разів на піксель-другий, щоб межа контуру не була такою рваною,

і приховуєте все біле під маску

В основному документі вже робите зі смарт-об'єктом все, що завгодно, майже як з векторним шейпом.

При зменшенні смарт-об'єкта нерівності контуру стануть менш помітними. Тому краще скринити із запасом, а потім уже зменшувати до потрібного розміру.

Вектор

Якщо потрібен вектор, то робимо трасування в Ілюстраторі.

Відкриваємо скрін з PNG-файлу:

На панелі Image Traceставимо Mode: Black and White,галочку Previewі акуратнокрутимо Thresholdта налаштування в Advanced:

Отримавши прийнятний результат, робимо написи Expand

і отримуємо вектор на всі випадки життя:

Безкоштовні шрифти

Можливо, що шуканий шрифт-це не комерційна історія і робився фаном або не для продажу. Тоді немає сенсу шукати його в офіційних магазинах.

За безкоштовними шрифтами йдемо у Вконтакті, до групи «

Як дізнатися, який шрифт використовувався можна онлайн, за кілька хвилин на спеціальних сайтах в Інтернеті. Для цього зазвичай потрібно завантажити на сайт картинку букв зі свого комп'ютера та запустити пошук.

Працювати з оформленням тексту доводиться лише веб-дизайнерам, що займаються оформленням сайтів, а й звичайним людям, яким доводиться оформляти текст підбираючи відповідний тип і розмір шрифту.

Робота над курсовою, презентацією або текстом будь-якого іншого формату, що вимагає визначити російський або латинський шрифт за розміром і формою написання, буде оформлена набагато швидше, якщо використовувати спеціальні сервіси в режимі онлайн. Вони допоможуть закодованим зображенням знайти назву потрібного шрифту.

Огляд таких сайтів допоможе користувачеві заощадити час, навчить використовувати спеціалізовані ресурси для спрощення роботи з текстовими редакторами та підкаже, як швидко дізнатися шрифт на такому сайті.

Слід враховувати, що більшість сервісів шукають латинські алфавіти для англійської та німецької мов.

Спеціалізовані сервіси

Знаючи, як визначити шрифт по картинці, що підходить для роботи, можна раціонально розподілити свій робочий час і правильно оформити свій текст таким зображенням літер, яке буде найбільш доречним для того чи іншого конкретного випадку.

Перш ніж заходити на такий сайт, потрібно зрозуміти, як можна дізнатися шрифт на сайті за допомогою певного алгоритму дій.

Робота в сервісах, що містять величезну кількість варіантів написання російських та латинських літер, швидко дозволить визначити шрифт, що шукається в режимі онлайн, який краще підійде при оформленні текстів. Вона складається з наступних кроків:

  1. у своєму комп'ютері слід зберегти сподобалося зображення шрифту;
  2. вибрати в Інтернеті потрібний сервіс для пошуку назви даного формату літерних позначень. Список буде нижчим.
  3. на сайті, що зберігає велику базу відповідних шрифтів, методом автоматичної ідентифікації можна порівняти свою збережену картинку з наявними зразками та отримати точну назву шрифту
  4. завантажити у спеціальне поле веб-ресурсу своє зображення шрифту із комп'ютера. Якщо картинка букв не дуже якісна, то доведеться вводити у спеціальне поле всі наявні букви окремо, щоб швидко знайти потрібний шрифт по картинці.

Цікаве на тему Набір віджетів для Adobe Muse

Розпізнавання потрібного шрифту відбувається в автоматичному режимі. Так як дізнатися формат шрифту на сайті програма може тільки за якісною картинкою, слід завантажувати для ідентифікації зображення дозволом не менше 100 пікселів, що допомагають підібрати шрифт на завантаженому малюнку.

Найпопулярніші сервіси, які допомагають шукати формат відповідних букв

Пошук відповідного шрифту за завантаженою картинкою можуть здійснювати кілька сайтів у режимі онлайн:

  • Type Navigator,
  • typophile.com
  • Flickr Typeface Identification.

Кожен ресурс має свої особливості в роботі, які користувачі повинні враховувати, щоб визначити тип шрифту на сайті на такому сайті. Зазвичай ресурс докладно визначає, що потрібно робити користувачеві для пошуку шрифтів.

Покроковий посібник для пошуку пропонує сайт What The Font. Щоб програма змогла розпізнати зображення на завантаженій картинці, слід використовувати для розпізнавання шрифту зображення в наступних форматах:

  • JPEG,

При роботі з такими сервісами як What Font Is, слід враховувати, що шрифт на завантаженій картинці може визначатися безкоштовно та платно. Під час вибору користувач вибирає потрібну опцію, чим може звужувати або розширювати результати свого підбору.

На сайтах Bowfin Printworks і Identifont, щоб дізнатися відповідний шрифт за завантаженою картинкою в режимі онлайн, потрібно відповідати на питання, пов'язані з описом буквених зображень.

Слід враховувати, що розпізнати шрифт по картинці можна буде швидко тільки для латинського алфавіту. Знайти відповідний формат зображення кирилиць на цих ресурсах буде неможливо. Щоб визначити російський шрифт за наявним зображенням, доведеться пошукати інформацію в Інтернеті в його російськомовному сегменті.

Дізнатися, який шрифт у цьому випадку найкраще підійде, допоможе ресурс ФонтМассив або бази даних відомих пошукових систем Яндекс і Google.

Цікаве на тему Розробка власного логотипу: яким він має бути?

Використання плагіна у браузерному рядку

Якщо доводиться часто підшукувати відповідний формат зображення букв латинського або кириличного типу, то для швидкості роботи можна використовувати спеціальний плагін, завантажений у браузер. Такий спосіб дозволить швидко дізнаватися, що за шрифт вказаний на зображенні і як він називається.

На роботі мені знадобилося дізнатися стиль написання букв, оскільки я працюю гравірувальником, знайшов інструмент пошук шрифту на картинці. Добре, що зараз є багато способів, розберу три популярні способи:

Пошук шрифту по картинці з whatfontis

Розберу найкращий сервіс з пошуку шрифту на картинці whatfontis, а в останньому пункті надам ще шість. Заходимо за посиланням та бачимо меню завантаження.

  1. Завантажуємо зображення зі шрифтом із комп'ютера.
  2. Заливаємо по URL.
  3. Відкриваємо додаткові опції.
  4. Зазначаємо, якщо по картинці є тінь.
  5. Якщо лінія шрифту йде не чітко по горизонталі, його треба вирівняти, відзначаємо галочку.
  6. Якщо потрібно редагувати файл, то на сервісі є вбудований менеджер.
  7. Продовжити.

Онлайн сервіс розіб'є файл по літерах, можливо він може не правильно розкласти, тоді можна об'єднати елементи простим перетягуванням, затискаємо ліву кнопку миші і перетягуємо.

У моєму випадку розкладено нормально, але сервіс не зміг розпізнати символи, як бачимо порожні віконця. Можна залишити порожніми, але краще заповнити, щоб полегшити процес розпізнавання.

Пам'ятаєте ми відзначали пункт редактора, щоб увійти пролистайте вниз і знайдіть рядок запуску онлайн редактора. Для коректної роботи потрібна остання версія flash player.

Розглядати не буду, відредагований файл закидаємо назад на аналіз та робимо перевірку. Заповнивши всі поля з літерами, натискаємо велику червону кнопку continue і дивимося результат. Одного разу спрацював і розпізнав кириличне написання.

Знайшов 15 результатів, на скріншоті показані перші два рядки, шрифти дуже схожі на мій вихідний, з прикладом написання та назвою. На цьому все далі розберу розширення для браузера.

Порада, щоб шукати кирилиці, завантажуйте зображення з літерами, що збігаються з російськими, наприклад літери A, H, P і т.д.

Розширення What font: кирилиця не проблема

Сканер розширення дивиться на прописані шрифти у коді сайту, піддається обробці навіть кирилиця. На жаль, графічні елементи розпізнати не може, але все інше дуже швидко. Заходимо за посиланням та встановлюємо розширення у браузер.

Підходить майже для всіх видів браузерів google chrome, на яндексі та firefox йде відмінно, перевіряв.

Для активації натискаємо значок в активних та чекаємо на завантаження. Як тільки інструмент буде готовий до використання, він змінить колір. Тепер, щоб визначити шрифт, наводимо на необхідний елемент у сторінці.

  1. Значок став активним. Для включення процесу натискаємо, теж робимо для відключення.
  2. Елемент зі шрифтом.
  3. Розшифровка стилю, сімейства та написання.

Щоправда, не міг його не показати, хоча тема статті по картинці, але дати додаткову інформацію треба.

Додаток на мобільні пристрої

На жаль, не знайшов для андроїда, виручив додаток WhatTheFont, так і вводьте назву в itunes. Програма безкоштовно дає можливість завантаження зображень із самого пристрою та за допомогою відеокамери. Зручніше ніж з сервісами, можна сфотографувати фрагмент тексту, що сподобався, і дізнатися шрифт по картинці. Для роботи необхідне підключення до інтернету та відповідно додаток WhatTheFont.

Пробував у знайомого, працює і справляється краще за будь-який онлайн інструмент. Переходимо до вибірки альтернатив.

Альтернативні онлайн-сервіси

На додаток до першого пункту наведу ще 6 сайтів, більшість англійською, один російською. Онлайн методи побудовані порядку зменшення ефективності.

Myfonts аналог whatfontis

Розташовується за адресою, аналогічною те,щофонтис, так само може шукати по картинці, але результати не завжди точні. Щоразу видає різні результати, але з п'ятого може потрапити в ціль. Принципи спрямовані на пошук за деякими особливостями, завитки, засічки, товщина та інші.

Знайти можна тут, єдиний російський портал Fontmassive діє безкоштовно. Немає систем розпізнавань російської (смішно), є лише голос народу, відповідь дають люди. Потрібно зареєструватися та подати заявку, щоб підказали. Зручно і практично, щоб краще за людину на запитання ніхто не відповість.

Identifont.com знаходить шрифти за опитуваннями

Перебувати на сторінці , щоб визначити потрібне сімейство і стиль інструмент опитує вас про особливості шрифту, які літери, як розташовуються і так далі. Якщо сумніваєтеся, є кнопка “не впевнений”, спосіб більш тривалий, але зможе максимально наблизити до позитивного ефекту. Аналізувати можна і на кирилиці, написання ж однакове.

Можливість пошуку на typophile визначає знову таки людина, але тепер, щоб запустити пошук, від вас потрібно дати картинку, зробити окрему тему, і чекати відповіді від знавців. Відрізняється від Fontmassive наявністю просунутих фахівців, але знову англійською, гугл перекладач на допомогу.

Фішка bowfinprintworks: він відразу видає питання для заповнення у вигляді чекбоксів та прикладів. Є десять полів для заповнення, визначає шрифт написання лише деяких букв. Видає адекватний пошук хороший ефект, але треба аналізувати, не всі будуть вдивлятися в літери та символи.

Шкода, що програма для знаходження стилів, не існує. Було б зручно мати стаціонарний софт на комп'ютері.

Закінчу огляд, і скажу: пошук шрифту на картинці це копітка праця, автоматизовані способи не завжди дають позитивний результат, доведеться попрацювати руками. І наприкінці відео.

У важкій роботі веб-майстра часто буває така ситуація, що необхідно визначити шрифт на картинці. Думаю, кожен із нас стикався з подібною ситуацією.

Є гарний напис, проте, не завжди вдається одразу визначити те, який шрифт використовували. Що робити? Як визначити потрібний шрифт?

Показую, як вирішити таку ситуацію.

Визначаємо шрифт на зображенні

Для вирішення завдання підійде сервіс під назвою Myfonts.

Відразу хочу сказати, що сервіс спрацює коректно, якщо ви надасте йому гарне горизонтальне зображення, без будь-яких нахилів і зайвих предметів. Відкрийте ваше зображення в будь-якому редакторі, і просто виріжте область зі шрифтом, і, якщо потрібно, поверніть зображення, щоб вийшов горизонтальний текст.

Мені потрібно було з'ясувати, яким кириличним шрифтом зроблено напис. Я вирізав потрібну ділянку, ось що вийшло:

Сервіс подумає та видасть результат. В даному випадку все визначилося коректно, якщо ні, то йому треба допомогти і вставити потрібні літери в поле введення. Тиснемо Continue.

Все в порядку. Шрифт визначився.

Ось так, легко і просто визначається будь-який шрифт на зображенні. Думаю, сервіс стане в нагоді.

Досить часто на всіляких сервісах питань і відповідей люди ставлять те саме питання: « Як визначити шрифт по картинці».

Тим, хто не пов'язаний за родом діяльності з графікою або вебдизайном, складно зрозуміти, навіщо це необхідно)) Ті, хто «в темі» добре знають, як складно визначити тип шрифту на будь-якій картинці або логотипі і підібрати його так, щоб текст виглядав майже як на оригіналі.


Раніше я вже писав про онлайн сервіс, що дозволяє під якісь потреби, але цей інструмент безсилий, коли потрібно ідентифікувати тип шрифту за конкретним прикладом. Тому поспішаю представити Вам інструмент, який може допомогти в таких випадках.

WhatTheFont – безкоштовний онлайн сервіс, який допоможе визначити шрифт на картинці. Для того, щоб результат визначення був максимально точним, бажано дотриматися таких умов:

  • літери не повинні зливатися другом, мати чіткі контури
  • літери мають бути вирівняні по горизонтальній лінії
  • бажано, щоб висота букв була близько 100px

Щоб визначити шрифт по картинці, необхідно завантажити цю картинку на сервіс або вказати її адресу в інтернет. Обидві ці дії виконуються на головній сторінці WhatTheFont.

Як приклад давайте визначимо шрифту логотипі мого сайту MuzRelax.ru. Я знаю, який шрифт там використаний, а ось подивимося, чи зможе сервіс WhatTheFont коректно його ідентифікувати.


До речі, тим, хто ще не відвідував цей сайт, рекомендую зробити це – отримайте справжнє задоволення).

Я зробив скріншот лого і завантажив картинку в такому вигляді:

Як бачите, фон шрифту навіть не контрастний, хоча це теж бажана умова (чорна на білому або біла на чорному).

На наступній сторінці сервіс автоматично розіб'є весь напис на зображенні на окремі літери і спробує їх визначити. Літери, які не визначилися, або ідентифіковані не так, Ви можете вписати самі в маленьких віконцях. У моєму прикладі все визначилося правильно в автоматичному режимі.

На фінальному етапі сервіс видасть список шрифтів, які виглядають схожі на той шрифт, який є на картинці. У моєму випадку було запропоновано 4 варіанти, найперший із яких (Georgia) і є той тип шрифту, який я використовував у логотипі сайту MuzRelax.ru. Відмінний результат!

На жаль, WhatTheFont має кілька недоліків:

  • Хоча база даних сервісу містить величезну кількість шрифтів, деякі екзотичні він визначити не в змозі
  • Кирилічні шрифти сервіс не визначає. Однак цей недолік досить умовний, тому що в інтернеті немає жодного сервісу визначення шрифту по картинці, який працював би з кириличними шрифтами. На жаль…

WhatTheFont є лідером серед собі подібних онлайн сервісів, має гарну спільноту, куди можна звернутися за допомогою при визначенні шрифту, повністю безкоштовний та працює дуже спритно. Рекомендую однозначно!

P.S. Не забудьте залишити цю статтю в закладках і порекомендувати своїм друзям).

Сподобалася стаття? Поділіться з друзями!