Чтобы добавить шрифт в Фигму, его ставят не в саму Figma, а в систему компьютера. Скачайте файлы в формате TTF или OTF, установите их в Windows или macOS, а если работаете в браузере, поставьте ещё бесплатный установщик шрифтов Figma. Потом перезагрузите вкладку с файлом (или перезапустите приложение) и найдите шрифт в списке шрифтов через фильтр «Installed by you». Обычно хватает нескольких минут.
Ниже разберём каждый шаг для браузера и для приложения, загрузку шрифта в аккаунт и для команды, шрифты на сайте в Figma Sites и то, почему Figma иногда не видит установленный шрифт. Если вы только знакомитесь с редактором, начните с обзора возможностей Figma.
CheckroiПодборка курсов по Figma352 курса • 55 школСравните цены, школы, программу и найдите выгодные предложения по обучениюСравнить→
Какие шрифты уже есть в Figma без установки
Ставить шрифт нужно не всегда. По справке Figma, в каждом файле по умолчанию доступны шрифты Google Fonts и шрифты Apple. Inter, Roboto, Montserrat, Open Sans, PT Sans и сотни других из каталога Google открываются прямо в списке, скачивать их не нужно.
Поэтому сначала откройте список шрифтов и наберите название. Если нашёлся, работайте. Если нет, шрифт коммерческий или из другого каталога, и его придётся установить. Встроенные шрифты с русскими буквами и адреса остальных есть в отдельной подборке шрифтов для Фигмы с кириллицей.
Интерфейс Figma на английском. Русского языка в нём нет, на странице загрузок перечислены английский, французский, немецкий, испанский, японский, корейский и португальский. Поэтому ниже названия пунктов меню даны так, как они выглядят в программе. Обходные пути с русификацией мы разобрали в статье про Figma на русском.
Как добавить шрифт в Фигму: пошаговая инструкция
Порядок один для любого шрифта, будь то бесплатный с сайта шрифтов для коммерческого использования или купленный у словолитни.
- Скачайте файлы шрифта. Figma понимает только TTF и OTF. Обычно они лежат в ZIP-архиве, и у каждого начертания свой файл: Regular, Bold, Light. Архив распакуйте.
- Установите шрифт в систему. Как это сделать в Windows и на Mac, разберём ниже.
- Поставьте установщик шрифтов Figma, если работаете в браузере. В приложении для компьютера он уже встроен, шаг можно пропустить.
- Перезагрузите файл. В браузере обновите вкладку, приложение закройте и откройте заново.
- Найдите шрифт. Выделите текстовый слой, откройте список шрифтов в правой панели, в фильтре выберите «Installed by you» и наберите название.
Как выбрать файл шрифта перед установкой
Четыре проверки до установки избавят от переделок, когда макет уже свёрстан.
- Формат. Нужен TTF или OTF. Архив, в котором только WOFF и WOFF2, содержит веб-версию для сайтов, в Figma её не установить.
- Русские буквы. Наберите кириллицу в превью на сайте шрифта: у многих гарнитур её нет совсем.
- Начертания. Если в макете понадобятся жирный и тонкий, ставьте архив целиком, а не один файл Regular.
- Лицензия. Бесплатно скачать не значит бесплатно использовать в коммерческом проекте. Как это проверить, мы разбирали в статье о шрифтах для коммерческого использования.
Как установить шрифт в Windows
По справке Microsoft, щёлкните файл шрифта правой кнопкой мыши и выберите «Установить». Если система спросит разрешение на изменения, подтвердите.
Можно и проще: перетащите файлы в папку C:\Windows\Fonts. Выделите сразу все начертания, тогда в Figma появится вся гарнитура, а не только обычный вес.
Как установить шрифт на Mac
На Mac шрифтами заведует приложение «Шрифты» (Font Book). Справка Apple предлагает несколько путей. Самый быстрый: дважды нажмите файл шрифта в Finder и в появившемся окне нажмите «Установить».
Ещё можно перетащить файл в окно приложения «Шрифты». Заодно оно само проверит шрифт на ошибки и предупредит, если такой уже установлен. Если проверка нашла ошибки, такой файл лучше удалить: Apple советует так поступать со шрифтами, которые отображаются некорректно.
Шрифт в системе один для всех программ: поставили его для Figma, и он появится в Word и Photoshop. Как это выглядит в самом Photoshop, мы показали в инструкции, как добавить шрифт в Фотошоп.
Канал основателя Checkroi Вани Буявца3 700 человек читают мой Телеграм-канал про нейросетиСобрал промпты для Claude Code и ChatGPT, разборы ИИ-инструментов и лайфхаки по продвижению бизнеса в одном местеПрисоединитьсяКак добавить шрифт в браузерную версию Figma
Браузер сам не видит шрифты в системе, поэтому Figma ставит на компьютер маленькую программу. Она называется Figma Font installer, в списке процессов значится как FigmaAgent. Окна у неё нет: она работает в фоне и передаёт вкладке figma.com список установленных шрифтов.
Скачать установщик можно на официальной странице загрузок Figma, в блоке «Other»: там есть версии для macOS и Windows.
После установки откройте файл в браузере. Свежие версии Chrome спросят, можно ли сайту figma.com подключаться к приложениям на вашем устройстве. Разрешите доступ. По справке Figma о доступе к локальной сети, без этого разрешения редактор работает, но своих шрифтов в списке не будет.
Если в окне с вопросом вы уже отказали, разрешение меняют в настройках сайта:
- Откройте figma.com в Chrome и нажмите значок настроек слева от адреса.
- Перейдите в настройки сайта.
- Найдите разрешение на доступ к приложениям на устройстве (в Chrome до 145-й версии оно называлось доступом к локальной сети) и разрешите его.
- Обновите страницу.
Проверить, видит ли Figma установщик, можно в самом редакторе. Откройте главное меню и перейдите в «Preferences» → «Permissions and helpers». В строке «Local network access» не должно быть статусов «Blocked» или «Not connected». Так советует справка по неполадкам установщика.
Как добавить шрифт в десктопное приложение Figma
В приложении всё проще: установщик шрифтов уже внутри. Поставили шрифт в систему, перезапустили Figma, нашли шрифт в списке. Если приложения у вас ещё нет, вот инструкция, как установить Figma на компьютер.
| Браузер | Приложение | |
|---|---|---|
| Шрифт установить в систему | да | да |
| Отдельный установщик шрифтов | нужен | встроен |
| Разрешение в Chrome | нужно | не нужно |
| Чтобы шрифт появился | обновить вкладку | перезапустить приложение |
| Linux и ChromeOS | свои шрифты не поддерживаются | |
Если Chrome упорно блокирует доступ, а разбираться с настройками некогда, откройте файл в приложении: Figma сама предлагает этот путь тем, кто не хочет выдавать браузеру разрешение.
Если вы осваиваете Figma с нуля и хотите разобраться в редакторе целиком, посмотрите курсы по Figma в нашем каталоге: там можно сравнить программы по цене и длительности.
Как загрузить шрифт в аккаунт и для всей команды
Установленный шрифт живёт только на вашем компьютере. Коллега откроет тот же макет и увидит значок недостающего шрифта, пока не поставит у себя ту же версию. У Figma есть два способа хранить шрифт в облаке.
Шрифт в своём аккаунте
Этот способ Figma описывает для своего ИИ-помощника и MCP-сервера: они работают на серверах Figma и шрифтов с вашего диска не видят. Загруженный в аккаунт шрифт доступен им и вам в любом файле.
- В файловом менеджере Figma нажмите на аватар в левом верхнем углу.
- Откройте «Settings» → «Account» → «Your uploaded fonts».
- Нажмите «Upload fonts» и выберите файл.
- Подтвердите, что у вас есть права на этот шрифт.
Загруженные шрифты появятся в отдельном разделе списка «Uploaded by you».
Шрифт для организации или команды
На тарифах Organization и Enterprise администратор загружает шрифт один раз, и он доступен всем: путь «Admin» → «Resources» → «Fonts», а для отдельной команды шрифт загружают в её настройках. По справке об общих шрифтах, так своими шрифтами могут пользоваться даже владельцы Chromebook и Linux.
Оговорка для России: по политике Figma, новым клиентам из России компания платные тарифы не продаёт, включая переход на Organization и Enterprise. Бесплатный тариф Starter работает. Если тариф с общими шрифтами вам недоступен, договоритесь в команде ставить шрифт из одного источника и одной версии у каждого: например, с сайта словолитни из нашей подборки шрифтов для Фигмы.
Как подключить свой шрифт к сайту в Figma Sites
Для макета в Figma Sites хватает обычной установки. А вот опубликованный сайт открывают чужие браузеры, где вашего шрифта нет. Поэтому перед публикацией Figma попросит загрузить веб-версию шрифта в формате WOFF или WOFF2.
- Убедитесь, что хотя бы один текстовый слой в файле набран этим шрифтом.
- Нажмите «Site settings».
- В левой панели выберите «Fonts».
- Нажмите «Upload» и добавьте файл WOFF или WOFF2 для каждого шрифта.
Порядок описан в справке Figma Sites. Там же напоминание о лицензии: для опубликованного сайта нужна лицензия, которая разрешает такое использование шрифта. Проверьте условия до загрузки файла. Как читать лицензии бесплатных шрифтов, мы разбирали в статье о шрифтах для коммерческого использования.
Канал основателя Checkroi Вани БуявцаЗабирайте промпты и обучение по нейросетям в моём Телеграм-каналеБольше 3 700 человек уже применяют Claude Code, ChatGPT и другие нейросети в работе, учёбе, бизнесе и жизниПерейти в каналAdobe Fonts и вариативные шрифты в Figma
Шрифты Adobe Fonts работают так же, как обычные установленные. Активируйте шрифт в приложении Adobe Creative Cloud, и он появится в Figma, в браузере через тот же установщик. По справке Figma про Adobe Fonts, если долго не открывать приложения Adobe, шрифты перестают работать, и их приходится установить заново.
Вариативный шрифт хранит все начертания в одном файле, а вес и ширину можно двигать ползунком. Ставится он так же, как обычный шрифт. Оси настраивают во вкладке «Variable» панели свойств текста, подробности в справке о вариативных шрифтах. Как выбирать размер, мы объясняли в статье о том, что такое кегль.
Почему Figma не видит установленный шрифт
Чаще всего шрифт не дошёл до редактора. Пройдитесь по таблице сверху вниз: первые строки встречаются чаще.
| Что видите | Причина | Что сделать |
|---|---|---|
| Шрифта нет в списке, в Word он есть | браузер не связан с установщиком | поставить Figma Font installer, разрешить доступ в Chrome, обновить вкладку |
| Шрифта нет в приложении | Figma не перезапускали после установки | закрыть и открыть приложение |
| Файл не устанавливается | формат WOFF, WOFF2 или EOT | найти тот же шрифт в TTF или OTF |
| Есть Regular, нет Bold | установлен один файл из архива | поставить все начертания |
| У коллеги значок недостающего шрифта | шрифт стоит только у вас | коллеге поставить ту же версию или заменить шрифт |
| Текст сдвигается при правке | у вас и у коллеги разные версии шрифта | поставить шрифт из одного источника и пересчитать слои |
| Работаете на Linux или Chromebook | Figma не поддерживает там свои шрифты | только встроенные шрифты или общие шрифты организации |
Как заменить недостающий шрифт
Когда в файле есть шрифт, которого у вас нет, в левой панели появляется значок. Нажмите его, откроется окно «Missing fonts». Под заголовком «Replacement» выберите замену для каждого шрифта и нажмите «Replace fonts».
Учтите: замена применяется для всех, кто работает с файлом, включая тех, у кого исходный шрифт есть. Поэтому перед заменой сохраните версию файла. Как это сделать, мы рассказывали в статье о том, как сохранить проект в Фигме.
Как убрать конфликт версий
Если текст прыгает на пару пикселей или меняет начертание, у редакторов файла стоят разные версии шрифта. По справке о конфликтующих шрифтах, всем нужно удалить шрифт, поставить его из одного источника и перезапустить Figma.
Потом выделите слой с этим шрифтом, выберите «Select all with same font» и запустите команду «Recompute Text Layout in Selection» через меню быстрых действий.
Как удалить установщик шрифтов
В Windows установщик удаляют через панель управления, в списке установленных программ. Называться он может Figma Agent, Figma Font Helper или Figma Service. На Mac справка Figma предлагает выполнить в приложении Терминал команду:
/bin/bash -c "$(curl -fsSL https://desktop.figma.com/agent/mac/uninstall.sh)"Имейте в виду: без установщика браузерная Figma перестанет видеть и ваши шрифты, и шрифты Adobe.
Где освоить Figma и типографику системно
Установить шрифт можно за несколько минут. Подобрать к макету пару шрифтов и выстроить иерархию текста гораздо сложнее. Этому учат на курсах по Figma: от интерфейса до дизайн-систем. Работу с текстом в Figma продолжает разбор текста по кругу.
Ниже пять курсов по Figma из нашего каталога. Полный список с ценами и сроками есть в каталоге курсов по Figma, отдельно есть курсы по типографике.
| Курс | Школа | Стоимость со скидкой | В рассрочку | Длительность | Обзор курса от Checkroi |
|---|---|---|---|---|---|
| Основы дизайна в Figma Перейти на сайт курса |  Bonnie & Slide | 42 800 ₽ | 2366 ₽/мес. | 4 недели | Обзор курса |
| Figma 2.0 Перейти на сайт курса |  Skillbox | 29 394 ₽ | 4899 ₽/мес. | 2 месяца | Обзор курса |
| Figma с нуля до PRO Перейти на сайт курса |  Академия Синергия | 31 836 ₽ | 2653 ₽/мес. | 2 месяца | Обзор курса |
| Figma с нуля до PRO Перейти на сайт курса | Skillbox | 39 334 ₽ | 1091 ₽/мес. | 2 месяца | Обзор курса |
Больше программ — в полном каталоге курсов по Figma
