# Чёткие гротески для интерфейсов приложений > Гротески с открытой лицензией, которые остаются чёткими в кнопках, меню, таблицах и настройках и предлагают нужные интерфейсу насыщенности. От шрифта в интерфейсе требуется больше, чем от шрифта в заголовке. Почти весь текст там короткий и мелкий: подписи в 12–13 пикселей, ячейки таблиц, подсказки под полем. На таких размерах важны раскрытия в буквах вроде a, e и s, достаточная высота строчных и цифры, которые легко отличить друг от друга. В поле пароля заглавная I, строчная l и цифра 1 не должны выглядеть одинаково. Диапазон насыщенностей важен почти так же. Продукту обычно нужны Regular для основного текста, Medium или SemiBold для кнопок и Bold для выделения, причём разница между ними должна быть заметна с первого взгляда. В семействах с вариативной осью насыщенности можно выбрать точное значение, а не довольствоваться ближайшим именованным начертанием. Курсив в интерфейсах нужен реже, чем в статьях, поэтому здесь есть несколько семейств только с прямыми начертаниями, и это отмечено. Если продукт выходит на нескольких языках, перед выбором посмотрите, какие письменности поддерживает семейство, — это указано рядом с каждым. How these were chosen: Гротески, отмеченные для интерфейсов, минимум с четырьмя насыщенностями. В заметке к каждому указано, что в его карточке сказано о курсиве, осях и письменностях. ## Fonts (18) - [Inter](https://trendhub.net/ru/fonts/inter.markdown) (Гротески, начертаний: 18 · вариативный, OFL): Создан для экранов: девять насыщенностей, курсив и ось оптического размера, которая подстраивает буквы под мелкий и крупный кегль. - [Roboto](https://trendhub.net/ru/fonts/roboto.markdown) (Гротески, начертаний: 18 · вариативный, OFL): Девять насыщенностей с курсивом и ось ширины: одно семейство подходит и для плотных таблиц, и для основного текста, и для крупных заголовков. - [Figtree](https://trendhub.net/ru/fonts/figtree.markdown) (Гротески, начертаний: 14 · вариативный, OFL): Сделан для веба и мобильных приложений: семь насыщенностей от Light до Black с курсивом на одной вариативной оси. - [DM Sans](https://trendhub.net/ru/fonts/dm-sans.markdown) (Гротески, начертаний: 18 · вариативный, OFL): Геометричные буквы с небольшим контрастом и осью оптического размера от 9 до 40, для подписей и заголовков. - [Plus Jakarta Sans](https://trendhub.net/ru/fonts/plus-jakarta-sans.markdown) (Гротески, начертаний: 14 · вариативный, OFL): Открытые внутрибуквенные просветы и чуть увеличенные строчные сохраняют читаемость мелких подписей; семь насыщенностей от ExtraLight до ExtraBold с курсивом. - [Manrope](https://trendhub.net/ru/fonts/manrope.markdown) (Гротески, начертаний: 7 · вариативный, OFL): Вариативная ось насыщенности от ExtraLight до ExtraBold, кириллица и греческий для многоязычных продуктов; только прямые начертания. - [IBM Plex Sans](https://trendhub.net/ru/fonts/ibm-plex-sans.markdown) (Гротески, начертаний: 14 · вариативный, OFL): Семь насыщенностей с курсивом и ось ширины, которая сужает буквы для компактных панелей. - [Source Sans 3](https://trendhub.net/ru/fonts/source-sans-3.markdown) (Гротески, начертаний: 16 · вариативный, OFL): Задуман как интерфейсный гротеск: восемь насыщенностей от ExtraLight до Black с курсивом, кириллица и греческий. - [Work Sans](https://trendhub.net/ru/fonts/work-sans.markdown) (Гротески, начертаний: 18 · вариативный, OFL): Подстроен под экранный текст от 14 до 48 пикселей, девять вариативных насыщенностей с курсивом. - [Ubuntu](https://trendhub.net/ru/fonts/ubuntu.markdown) (Гротески, начертаний: 8, UFL): Сделан для интерфейса рабочего стола и вручную оптимизирован для экранов (хинтинг); четыре насыщенности с курсивом. - [Nunito Sans](https://trendhub.net/ru/fonts/nunito-sans.markdown) (Гротески, начертаний: 16 · вариативный, OFL): Четыре вариативные оси, среди них оптический размер и высота строчных, позволяют менять плотность текста, не меняя семейство. - [Geist](https://trendhub.net/ru/fonts/geist.markdown) (Гротески, начертаний: 18 · вариативный, OFL): Высокие строчные и открытые внутрибуквенные просветы даже в Black, поэтому насыщенные подписи остаются чёткими; девять насыщенностей с курсивом и кириллица. - [Public Sans](https://trendhub.net/ru/fonts/public-sans.markdown) (Гротески, начертаний: 18 · вариативный, OFL): Нейтральный гротеск, созданный для государственной дизайн-системы, в девяти вариативных насыщенностях с курсивом. - [Onest](https://trendhub.net/ru/fonts/onest.markdown) (Гротески, начертаний: 9 · вариативный, OFL): Занимает место между геометрическим и гуманистическим гротеском; буквы остаются различимыми в мелком навигационном тексте; от Thin до Black с кириллицей, только прямые начертания. - [Albert Sans](https://trendhub.net/ru/fonts/albert-sans.markdown) (Гротески, начертаний: 18 · вариативный, OFL): Почти круглые чаши и штрихи почти одинаковой толщины в девяти насыщенностях с курсивом; только латиница, с полным набором турецких и польских букв. - [Be Vietnam Pro](https://trendhub.net/ru/fonts/be-vietnam-pro.markdown) (Гротески, начертаний: 18, OFL): Рассчитан на технологические продукты, вьетнамские диакритические знаки нарисованы в первую очередь; девять насыщенностей с курсивом в статических файлах. - [Hanken Grotesk](https://trendhub.net/ru/fonts/hanken-grotesk.markdown) (Гротески, начертаний: 18 · вариативный, OFL): Девять вариативных насыщенностей с курсивом, настроенных для вывесок, книг и интерфейсов. - [Wix Madefor Text](https://trendhub.net/ru/fonts/wix-madefor-text.markdown) (Гротески, начертаний: 10 · вариативный, OFL): Текстовое начертание продуктовой шрифтовой системы, созданное для интерфейсов: пять насыщенностей с курсивом и кириллица. ## FAQs ### Можно ли встраивать эти шрифты в коммерческое приложение? У каждого семейства здесь открытая лицензия, чаще всего SIL Open Font License, которая разрешает использование в коммерческих продуктах и встраивание в приложения. Текст лицензии входит в каждый архив; точные условия смотрите на странице выбранного семейства. ### Что взять для интерфейса: вариативный шрифт или статические файлы? Вариативный файл содержит все насыщенности в одной загрузке и позволяет задавать промежуточные значения — это удобно, когда дизайн-системе нужны 450 или 550. Статические файлы остаются разумным выбором, если вы используете всего две-три насыщенности. ### Нужен ли курсив для текста в интерфейсе? Редко. В интерфейсах выделяют насыщенностью и цветом. Курсив пригодится, если продукт показывает длинные тексты, например статьи или документацию, в том же семействе. ### Как сочетать интерфейсный гротеск с шрифтом для кода? У нескольких семейств отсюда есть моноширинный собрат с теми же пропорциями. Если взять его, высота знаков и толщина штриха в тексте и в коде останутся согласованными. ## Related collections - [Гротески](https://trendhub.net/ru/fonts/for/grotesque-sans-serif-fonts.markdown) - [Гуманистические гротески для удобного чтения](https://trendhub.net/ru/fonts/for/humanist-sans-serif-fonts.markdown) - [Узкие гротески для таблиц и плотной вёрстки](https://trendhub.net/ru/fonts/for/narrow-fonts-for-tight-layouts.markdown) - [Моноширинные шрифты для программирования](https://trendhub.net/ru/fonts/for/monospace-fonts-for-coding.markdown) - [Вариативные шрифты с осью оптического размера](https://trendhub.net/ru/fonts/for/variable-fonts-with-optical-size.markdown) - [Квадратные гротески для технических и игровых интерфейсов](https://trendhub.net/ru/fonts/for/tech-and-game-interface-fonts.markdown) --- Source: https://trendhub.net/ru/fonts/for/app-interface-fonts (trendhub)