Как загрузить свой шрифт в Figma: три способа

Figma — самый популярный инструмент для UI/UX дизайна в 2026 году. Одной из ключевых особенностей一直是 работа с локальными шрифтами: вы можете установить шрифт на компьютер и использовать его в Figma-макетах. Но как именно это сделать — зависит от способа. В этой статье разберём три пути: локальную установку через ОС, Web Preview через Figma Agent и использование плагинов. Каждый из них имеет свои ограничения и сценарии применения.

Самый прямой способ — установить шрифт в операционную систему. На macOS: дважды кликните на .ttf или .otf файл и нажмите «Установить шрифт» в открывшемся окне Font Book. На Windows: правый клик на .ttf файл, выбрать «Установить». После установки шрифт появится в Figma в списке доступных шрифтов — в выпадающем списке слева вверху на панели свойств текстового блока.

Этот способ работает в Figma Desktop (нативное приложение) и в Figma Web при установленном Figma Agent. Figma Agent — это фоновый процесс, который позволяет веб-версии Figma обращаться к локальным шрифтам. Если вы используете Figma Web без агента, локальные шрифты видны не будут. Это частая причина проблем у пользователей, которые работают с Figma на разных компьютерах — на одном шрифт стоит, на другом нет.

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

Figma Agent — отдельный процесс, который устанавливается вместе с Figma Desktop. Его задача — обеспечить доступ к локальным файлам и шрифтам из веб-версии Figma. Если вы открыли Figma в браузере и хотите использовать локальный шрифт, агент «проксирует» запрос к ОС и возвращает шрифт в Figma. Это работает автоматически, без дополнительных настроек — если агент установлен и запущен.

Проверить, работает ли агент, можно в меню Figma: Settings → Account → Local Fonts. Если агент активен, вы увидите список всех локальных шрифтов, доступных в текущем браузере. Если список пуст — агент не запущен или у него нет доступа к шрифтам. На macOS иногда требуется выдать агенту дополнительные разрешения в System Settings → Privacy & Security → Automation.

Плюсы способа: не нужно держать Figma Desktop открытым, можно работать в браузере; шрифты доступны сразу после установки в ОС, без перезапуска Figma. Минусы: агент должен работать на каждом компьютере, с которого вы открываете Figma Web; на корпоративных компьютерах с ограничениями ИТ-департамента агент может быть заблокирован.

В Figma есть несколько плагинов, которые позволяют загружать шрифты напрямую в файл проекта, без локальной установки. Самый известный — Font Reset, который управляет подменой шрифтов при отсутствии. Также есть плагины от крупных фаундри, которые позволяют лицензировать и подключать шрифты в один клик. Для команд, работающих в Figma Organization, есть функция Teams Library — общая библиотека шрифтов, доступная всем участникам организации.

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

Плюсы способа: шрифт доступен всем участникам команды сразу; не требует локальной установки; решает проблему лицензирования для коммерческих шрифтов. Минусы: Teams Library доступна только в платных тарифах Figma (Organization и выше); плагины часто платные или с ограничением на количество шрифтов; есть риск, что шрифт «потеряется» при экспорте макета в другой формат.

Если вы работаете один — локальная установка через ОС. Простой, надёжный способ, без зависимостей. Если у вас несколько компьютеров — установите шрифт на каждом, либо используйте Figma Web с агентом на каждом из них. Если вы в команде — Teams Library (если тариф позволяет) или плагины. Если у вас специфический шрифт с ограниченной лицензией — уточните у фаундри условия, многие разрешают инсталляцию в Figma Library.

Из каталога FontHub шрифты можно скачать в форматах TTF, OTF, WOFF2. Для Figma нужен TTF или OTF — WOFF2 подходит только для веба. Все бесплатные шрифты в каталоге распространяются под лицензией SIL OFL, которая разрешает свободную установку и модификацию, так что проблем с лицензией не будет. Для premium-шрифтов лицензия уточняется индивидуально — но в большинстве случаев инсталляция в Figma Library разрешена.

Ещё один нюанс: при работе со шрифтами в Figma учитывайте разницу между векторным и растровым рендером. Figma рендерит шрифты векторно, что даёт идеальное качество на любом масштабе. Но при экспорте макета в PNG или JPG (например, для превью на лендинге) шрифт растеризуется, и могут появиться артефакты: лестничные края на диагоналях, размытие на тонких штрихах, искажение кернинга. Чтобы избежать этого: экспортируйте текст как SVG, а не как PNG — SVG сохраняет векторное качество. Если нужен именно PNG, используйте разрешение в 2-3 раза выше целевого (например, для 200×50 px логотипа экспортируйте как 600×150 px и масштабируйте в CSS) — это даёт чёткие края после растеризации. Второй момент: проверяйте экспорт в разных браузерах. PNG, экспортированный из Figma, может выглядеть по-разному в Chrome и Safari из-за разной обработки альфа-канала. Если для вас критична пиксельная идентичность — экспортируйте в SVG, который рендерится одинаково во всех современных браузерах. В каталоге FontHub все шрифты доступны в форматах TTF и OTF, которые корректно работают в Figma — вы получаете то же качество, что и в дизайн-макете, при переносе на прод.

«Шрифт в Figma — это не файл. Это часть процесса команды.» — Аманда Мендоза, Figma Design Advocate

Работа с собственными шрифтами в Figma — не самая сложная задача, но требует понимания контекста. Выбирайте способ под свою команду и свои задачи: локальная установка для одиночной работы, агент для нескольких компьютеров, Teams Library для команды. И помните, что шрифт — это не только файл, но и лицензия: прежде чем устанавливать, проверьте, разрешает ли она нужный вам сценарий использования.