Системные шрифты iOS и Android для кроссплатформенного продукта
Системные шрифты iOS и Android: что выбрать для продукта
Для кроссплатформенного продукта обычно не стоит механически назначать один и тот же шрифт всем платформам. На iOS базовым системным шрифтом служит семейство San Francisco, а в большинстве интерфейсных сценариев Android — Roboto. Лучший подход — сохранить общую типографическую систему, но учитывать платформенные метрики, доступность, локализацию и привычные паттерны каждой ОС.
Актуально на 22 июля 2026 года. Ниже разобраны различия между системными шрифтами iOS и Android, правила выбора, примеры для интерфейса и ошибки, из-за которых приложение выглядит одинаково только на макете, но не в реальном использовании.
Какие шрифты считаются системными на мобильных платформах
Системный шрифт — это гарнитура, которую операционная система использует по умолчанию для собственных интерфейсов и которую разработчик может подключить средствами платформы без добавления отдельного файла в приложение. Такой шрифт уже оптимизирован под экран, масштабирование, стандартные начертания, работу с динамическим размером текста и распространённые сценарии чтения.
В iOS основой интерфейсной типографики является San Francisco, часто обозначаемый как SF Pro. В зависимости от среды и задачи используются варианты для текста и крупных заголовков, а также специальные семейства для отдельных устройств и компактных интерфейсов. В Android ключевую роль играет Roboto; на отдельных системных поверхностях и устройствах могут встречаться дополнительные фирменные гарнитуры, но это не означает, что их следует безоговорочно считать универсальным шрифтом приложения.
San Francisco в iOS: особенности для интерфейса
San Francisco создан для плотных цифровых интерфейсов и хорошо работает в диапазоне от небольших подписей до крупных заголовков. Его важное свойство — выразительная разница между текстовыми и display-настройками: крупные надписи могут выглядеть компактнее и плотнее, а короткие строки сохраняют выразительность без чрезмерного межбуквенного интервала.
Для iOS особенно важны Dynamic Type и системная иерархия размеров. Пользователь может увеличить текст в настройках, поэтому фиксированная высота карточки, кнопки или строки списка способна привести к обрезанию контента. Если макет рассчитан только на один размер SF Pro, он не гарантирует корректное отображение при специальных возможностях, длинных локализациях и увеличенном системном масштабе.
San Francisco также задаёт визуальное ожидание iOS-интерфейса: аккуратные подписи, заметная разница между уровнями заголовков, умеренная плотность и предсказуемое поведение системных компонентов. Поэтому использование другого шрифта допустимо, когда оно связано с брендом или контентной задачей, но замена базовой гарнитуры должна проходить проверку на контраст, длину строк и доступность.
Roboto в Android: что влияет на восприятие
Roboto рассчитан на универсальное использование в интерфейсах, навигации, формах и текстовых блоках. У него нейтральный характер, заметные различия между начертаниями и хорошая поддержка латиницы, кириллицы и других письменностей через связанные шрифтовые наборы. Это делает Roboto практичной отправной точкой для Android-приложения, особенно если продукт не требует ярко выраженного фирменного почерка.
В Android необходимо учитывать не только размер шрифта, но и параметры font weight, line height, letter spacing и поведение текста при масштабировании. Одинаковое числовое значение размера в iOS и Android не гарантирует одинаковую визуальную высоту букв: у гарнитур разные x-height, вертикальные метрики, ширина знаков и расстояния над и под строкой.
На разных версиях Android, оболочках производителей и локалях возможны отличия в рендеринге и наборе запасных шрифтов. Поэтому Roboto следует проверять на реальных устройствах, а не только в эмуляторе. Особое внимание нужно уделить арабскому, кириллице, греческому, вьетнамскому языку и смешанным строкам, где fallback может изменить ширину текста и высоту блока.
Главные различия San Francisco и Roboto
San Francisco и Roboto решают похожую задачу, но не являются взаимозаменяемыми по метрикам. При переносе интерфейса между платформами меняются ширина заголовков, высота кнопок, длина пунктов меню и момент появления многоточия. Сравнивать нужно не только внешний рисунок букв, но и итоговое поведение компонентов в разных состояниях.
- Общее назначение: San Francisco и Roboto предназначены для экранного интерфейса и поддерживают многоуровневую типографическую иерархию.
- Визуальный характер: San Francisco чаще воспринимается как более тесно связанный с экосистемой Apple, а Roboto — как нейтральная и универсальная гарнитура Android.
- Метрики: одинаковый размер в пунктах или логических единицах даёт различную высоту строки, ширину текста и положение базовой линии.
- Начертания: названия и доступные веса могут отличаться, поэтому regular, medium, semibold и bold нельзя сопоставлять только по названию.
- Масштабирование: обе платформы поддерживают увеличение текста, однако компоненты и системные настройки реагируют на него по-разному.
- Fallback: при отсутствии нужного знака подключается запасной шрифт, который способен изменить ритм строки и внешний вид отдельных символов.
- Лицензирование: системные гарнитуры следует использовать в рамках правил соответствующей платформы; для брендового шрифта нужно отдельно проверить права и условия распространения.
Единый шрифт или нативная типографика для каждой ОС
Для большинства приложений оптимальна гибридная стратегия: сохранить общую систему ролей, размеров и смысловой иерархии, но использовать нативный системный шрифт на каждой платформе. Например, роль «заголовок экрана» может иметь единый размер и вес в дизайн-системе, а конкретной гарнитурой будет San Francisco на iOS и Roboto на Android.
Нативная типографика особенно уместна для банковского приложения, сервиса доставки, маркетплейса, календаря или продукта с большим количеством форм и списков. Пользователь быстрее распознаёт знакомые системные паттерны, а команда получает более предсказуемое поведение стандартных компонентов. Это не мешает сохранять индивидуальность через цвет, сетку, иллюстрации, иконки и акцентные заголовки.
Единый брендовый шрифт оправдан, если типографика является частью узнаваемости продукта, а визуальное единство важнее полного соответствия платформенным ожиданиям. В таком случае нужно подключать гарнитуру легально, включать кириллицу и необходимые символы, тестировать производительность и заранее определить fallback для отсутствующих знаков.
Как спроектировать типографику для кроссплатформенного продукта
Начинайте не с выбора конкретного названия шрифта, а с контентной модели. Опишите роли: заголовок экрана, заголовок секции, основной текст, вторичный текст, подпись, текст кнопки, числовое значение и системное сообщение. Для каждой роли задайте назначение, диапазон размеров, допустимые веса, минимальный контраст и поведение при увеличении текста.
- Зафиксируйте роли и уровни типографики в дизайн-системе, не привязывая их к названиям конкретных платформенных стилей.
- Назначьте нативные гарнитуры: San Francisco для iOS и Roboto для Android, если продукт не требует отдельного брендового решения.
- Проверьте длину реальных строк: названия товаров, ошибки, даты, суммы, адреса и кнопки с локализованным текстом.
- Настройте гибкие контейнеры, переносы и минимальную высоту строк вместо жёсткой обрезки по макету.
- Протестируйте динамический размер текста, жирные начертания, тёмную тему, контраст и режимы специальных возможностей.
- Сверьте реализацию дизайна и кода на физических устройствах, включая старую поддерживаемую версию ОС.
- Опишите правила fallback и зафиксируйте их в документации команды, чтобы дизайнеры и разработчики применяли одну логику.
Практические примеры: где различия становятся заметны
Карточка товара с длинным названием
Представим карточку товара с названием «Беспроводные наушники с активным шумоподавлением». В одной платформе строка может поместиться в две линии, а в другой — потребовать третью из-за ширины знаков и внутренних отступов. Если карточка имеет фиксированную высоту, цена или кнопка окажутся смещены. Надёжнее задать минимальную высоту, разрешить перенос и выровнять служебные элементы по нижнему краю.
Финансовый экран и моноширинные цифры
В экране баланса важна не только красота цифр, но и стабильное выравнивание значений. Если шрифт или его настройки используют пропорциональные цифры, числа разной длины могут визуально двигаться при обновлении суммы. Для таблиц, счетчиков и котировок стоит проверить табличные цифры, а также отдельно протестировать разделители тысяч, валютные знаки и отрицательные значения.
Кнопка с локализацией и увеличенным текстом
Кнопка «Продолжить» может легко превратиться в более длинную фразу при локализации. При увеличенном системном размере текста надпись перестаёт помещаться в одну строку. Используйте горизонтальные отступы, которые допускают сжатие, автоматическую высоту и перенос только там, где он не разрушает смысл. Для коротких действий лучше проверять минимум три языка и несколько размеров текста.
Частые ошибки в работе с системными шрифтами
- Сравнивать только названия гарнитур и игнорировать ширину строки, базовую линию и вертикальные метрики.
- Переносить размеры из макета iOS в Android один к одному без визуальной калибровки.
- Задавать фиксированную высоту кнопкам и карточкам, не учитывая увеличение текста.
- Использовать слишком много начертаний, из-за чего иерархия становится шумной, а загрузка брендового шрифта усложняется.
- Проверять только латиницу и пропускать кириллицу, валютные символы, диакритику и смешанные языковые строки.
- Подменять системный шрифт фирменной гарнитурой без проверки лицензии, веса файлов и поддержки нужных алфавитов.
- Считать, что одинаковая типографика означает одинаковые пиксельные значения во всех платформах.
Чеклист перед выпуском приложения
- Определены роли текста и правила их применения.
- Выбрана стратегия: нативные гарнитуры или единый брендовый шрифт.
- Проверены кириллица, латиница, цифры, знаки валют и специальные символы.
- Протестированы длинные строки, пустые состояния, ошибки и системные уведомления.
- Проверены увеличенный размер текста и настройки специальных возможностей.
- Проверены светлая и тёмная темы, контраст и читаемость вторичного текста.
- Проверены реальные устройства iOS и Android, а не только дизайн-макеты.
- Документированы fallback, веса, размеры, line height и исключения для отдельных компонентов.
FAQ: вопросы о шрифтах iOS и Android
Можно ли использовать Roboto в приложении для iOS?
Да, технически приложение может использовать Roboto на iOS, если гарнитура корректно подключена и её лицензия допускает такой сценарий. Однако Roboto изменит привычный для iOS ритм интерфейса и метрики компонентов, поэтому решение стоит принимать на уровне всей дизайн-системы, а не для одного экрана.
Нужно ли использовать один шрифт на обеих платформах?
Нет, единый файл шрифта не является обязательным условием кроссплатформенного продукта. Часто лучше использовать San Francisco на iOS и Roboto на Android, сохранив общие типографические роли, контраст, порядок заголовков и логику масштабирования.
Почему одинаковый размер шрифта выглядит по-разному?
Размер шрифта не описывает весь визуальный результат. Гарнитуры отличаются высотой строчных знаков, шириной символов, положением базовой линии, межстрочными метриками и формой начертаний. Поэтому значение нужно сопоставлять на реальном тексте и в конкретном компоненте, а не только по числу в настройках.
Какой шрифт лучше для русского языка в мобильном приложении?
Для русского интерфейса подходят и San Francisco, и Roboto при корректной поддержке кириллицы. Выбор зависит от платформенной стратегии, длины текстов, фирменного стиля и требований к локализации. Обязательно проверяйте буквы, ударения, кавычки, тире, номера телефонов и смешанные русско-латинские строки.
Как проверить шрифт при доступности и Dynamic Type?
Увеличьте системный размер текста и пройдите ключевые пользовательские сценарии: регистрацию, оплату, поиск, чтение ошибки и подтверждение действия. Текст не должен исчезать за границами контейнера, перекрывать кнопки или становиться неразличимым по контрасту. Проверяйте также жирный текст и режимы, влияющие на визуальную насыщенность интерфейса.
Когда стоит создать собственный шрифт для продукта?
Собственный шрифт оправдан, когда бренду нужна узнаваемая типографика, продукт строится вокруг контента или стандартные гарнитуры не передают нужный характер. Перед разработкой определите набор языков, веса, диапазон размеров и сценарии интерфейса. Для цифрового продукта важны не только отдельные буквы, но и качество текста в реальных строках.
Короткий вывод
San Francisco естественно вписывается в iOS, а Roboto — в Android, но качественный кроссплатформенный продукт строится не на слепом копировании размеров. Определите общую типографическую систему, адаптируйте метрики под каждую ОС и обязательно проверяйте локализацию, масштабирование и реальные состояния интерфейса.
Если стандартных гарнитур недостаточно для характера бренда, создайте собственный шрифт под задачи продукта на fontgenerator.ru. Это поможет объединить интерфейс, маркетинговые материалы и визуальный стиль без потери читаемости.