Как подключить локальные шрифты в Figma без ошибок

Чтобы подключить локальные шрифты в Figma, установите файлы OTF или TTF в операционную систему, запустите настольное приложение Figma либо включите Font Helper для браузера, затем проверьте гарнитуру в списке Text. Если шрифт не отображается, чаще всего причина в формате, конфликте версий, доступе к файлу или неработающем сервисе шрифтов.

Для работы подойдут локальные файлы шрифта в форматах OTF или TTF, сохранённые на компьютере. Файл WOFF или WOFF2 обычно предназначен для подключения шрифта на сайте и не является стандартным вариантом для установки в операционную систему. Если гарнитура поставляется архивом, сначала распакуйте его и найдите файлы отдельных начертаний.

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

Скачайте шрифт из доверенного источника или получите его от правообладателя. Откройте архив и проверьте состав папок: в комплекте могут находиться разные семейства, языковые версии и форматы для веба. Для Figma выбирайте файлы, которые операционная система распознаёт как устанавливаемые шрифты, а не файлы CSS или веб-форматы.

На macOS откройте файл шрифта через Font Book и нажмите кнопку установки. На Windows кликните по файлу правой кнопкой мыши и выберите установку; для общего доступа на компьютере может понадобиться вариант установки для всех пользователей. После этого гарнитура появится в системном каталоге шрифтов и станет доступна совместимым приложениям.

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

В настольном приложении Figma локальные шрифты обычно доступны после установки в системе и перезапуска приложения. При работе в браузере нужен отдельный сервис Font Helper, который позволяет редактору обращаться к шрифтам компьютера. Если помощник не установлен, браузер покажет только доступные веб- или облачные гарнитуры.

Если вы переключились с браузера на приложение или наоборот, полностью закройте прежний сеанс и заново откройте файл. Это обновляет список доступных гарнитур. Простое обновление вкладки иногда помогает, но при изменении системных шрифтов надёжнее перезапустить Figma и сервис Font Helper.

Откройте макет, выберите текстовый слой и нажмите на название текущего шрифта в правой панели свойств. Начните вводить название семейства не по имени файла, а по внутреннему названию гарнитуры. Например, файл BrandSans-Regular.otf может отображаться как Brand Sans, а название начертания будет указано отдельным параметром.

После выбора проверьте, что Figma показывает нужное начертание, а не автоматически подменяет его. Если в списке есть только Regular, но отсутствует Bold, это может означать, что файл Bold не установлен, называется иначе или содержит некорректные метаданные. Не имитируйте жирность вручную, если в проекте предусмотрено настоящее начертание.

Создайте тестовый текст: «Пример типографики: Ёжик съел финик, 2026». В нём есть кириллические буквы, нестандартная буква Ё, цифры и знаки препинания. Затем проверьте латиницу, длинное тире, кавычки и символы, которые используются в интерфейсе. Пустые квадраты или замены символов указывают на отсутствие нужных глифов.

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

Если локальная гарнитура не появилась в меню Figma, проверяйте проблему от простого к сложному: формат файла, факт установки, способ запуска редактора, перезапуск, дубликаты и метаданные. Такой порядок быстрее, чем повторно устанавливать весь комплект или менять настройки макета вслепую.

Главное различие связано не с самим макетом, а с доступом к системным ресурсам. Настольная Figma работает рядом с локальным окружением компьютера, тогда как браузер ограничивает доступ веб-страницы к файлам пользователя. Поэтому браузерной версии нужен Font Helper, а после его установки иногда требуется закрыть и заново открыть вкладку с редактором.

Если в настольной Figma шрифт виден, а в браузере отсутствует, почти всегда следует проверить Font Helper и разрешения приложения. Обратная ситуация может быть связана с разными профилями пользователей, удалённым рабочим столом или тем, что гарнитура установлена не в той операционной системе, где запущена Figma.

Представьте семейство Brand Sans с файлами Regular, Medium и Bold. Установите все три файла, перезапустите Figma и последовательно назначьте начертания заголовку, кнопке и основному тексту. Затем создайте текстовые стили с понятными названиями. Такой подход снижает риск случайной замены веса и помогает поддерживать единообразную типографику в макете.

Если макет с локальным шрифтом открывает коллега без установленной гарнитуры, Figma может заменить её на другую и показать предупреждение о недостающем шрифте. Перед передачей проекта подготовьте список семейств и начертаний, согласуйте лицензию и сообщите команде, какие файлы нужно установить. Для финального просмотра можно создать копию отдельных элементов в кривых, но рабочий текст лучше сохранить редактируемым.

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

Используйте этот короткий список перед созданием компонентов и текстовых стилей. Он помогает отделить проблему установки от проблемы самого файла и заранее выявить ограничения, которые проявятся только при передаче проекта другой команде.

Локальную гарнитуру обычно нельзя использовать в редакторе без доступа к её установленному системному файлу. В качестве альтернативы можно выбрать шрифт из доступной библиотеки Figma или использовать веб-шрифт, если он подключён к рабочему окружению проекта. Для совместной работы предпочтительнее заранее согласовать единый способ доступа к гарнитуре.

Чаще всего Figma была запущена до установки шрифта и ещё не обновила список гарнитур. Полностью перезапустите приложение, а в браузере дополнительно проверьте Font Helper. Если это не помогло, найдите дубликаты семейства и убедитесь, что установлен именно нужный файл, а не только веб-версия.

Наличие Regular не гарантирует наличие остальных начертаний. Файл Bold может быть не установлен, относиться к другому семейству или иметь некорректные внутренние имена. Проверьте системный каталог шрифтов, установите недостающий файл и перезапустите Figma. Не заменяйте настоящий Bold ручным увеличением насыщенности.

Распакуйте архив, откройте файл OTF или TTF и выберите установку шрифта через контекстное меню. После завершения закройте и снова запустите Figma. Если работа идёт в браузере, установите Font Helper. При ограниченных правах пользователя может потребоваться помощь администратора компьютера.

Откройте файл OTF или TTF через Font Book и подтвердите установку. Если macOS обнаружит дубликат или проблему в файле, изучите предупреждение до продолжения. Затем перезапустите Figma и проверьте семейство на тестовой строке с кириллицей, латиницей, цифрами и знаками препинания.

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

Надёжное подключение локального шрифта в Figma состоит из четырёх действий: установите корректный файл в операционную систему, выберите подходящий способ запуска редактора, перезапустите Figma или Font Helper и протестируйте все нужные языки и начертания. При командной работе заранее проверьте лицензирование и доступность гарнитуры у коллег.