Roboto Serif

Попробовать Roboto Serif

Насыщенности и начертания

• Thin 100Roboto Serif Thin Thin Italic
• ExtraLight 200Roboto Serif ExtraLight ExtraLight Italic
• Light 300Roboto Serif Light Light Italic
• Regular 400Roboto Serif Regular Курсив
• Medium 500Roboto Serif Medium Medium Italic
• SemiBold 600Roboto Serif SemiBold SemiBold Italic
• Bold 700Roboto Serif Bold Bold Italic
• ExtraBold 800Roboto Serif ExtraBold ExtraBold Italic
• Black 900Roboto Serif Black Black Italic

Roboto Serif — вариативный шрифт: весь диапазон насыщенностей в архиве умещается в отдельных файлах для каждого начертания, а названные выше насыщенности — точки в этом диапазоне.

О шрифте Roboto Serif

Roboto Serif — семейство антиквы в виде вариативного шрифта для чтения с экрана и на бумаге. На образце засечки прочные, со скруглёнными переходами, контраст между толстыми и тонкими штрихами умеренный, а строчные крупные, поэтому серость набора остаётся ровной от Thin до Black. Форму семейства задают четыре оси: насыщенность от 100 до 900, ширина от 50 до 150, оптический размер от 8 до 144 и градация от –50 до 100. Девять именованных насыщенностей выпускаются в прямом и курсивном начертании, всего 18 стилей. В официальных заметках шрифт назван минималистичным и функциональным: благодаря диапазону насыщенностей, ширин и оптических размеров его можно использовать даже в интерфейсах приложений. В 1 158 глифов входят латиница, расширенная латиница, кириллица и вьетнамский. Авторами названы Commercial Type и Greg Gazdowicz. Roboto Serif распространяется под SIL Open Font License 1.1.

Где уместен Roboto Serif

Длинные статьи

Оптический размер от 8 до 144 подстраивает рисунок под мелкий основной текст и под крупные заголовки в одном семействе.

Приложения для чтения и электронные книги

Ось градации, от –50 до 100, позволяет приложению делать текст светлее или темнее в зависимости от темы чтения.

Узкие газетные колонки

Ширина до 50 сжимает заголовок так, чтобы он поместился в тесную колонку.

Антиква в интерфейсах

В официальных заметках интерфейсы приложений названы одной из областей применения; Medium и SemiBold придают подписям достаточную плотность.

Антиква в паре с Roboto

Шрифт носит имя Roboto и охватывает тот же диапазон от Thin 100 до Black 900, что и гротеск.

Глифы

Поддержка языков

В семействе есть основные буквы, которыми пишут на этих языках:

• Английский
• Французский
• Немецкий
• Испанский
• Португальский
• Итальянский
• Нидерландский
• Шведский
• Норвежский
• Датский
• Финский
• Исландский
• Каталанский
• Турецкий
• Польский
• Чешский
• Словацкий
• Венгерский
• Румынский
• Хорватский
• Словенский
• Литовский
• Латышский
• Эстонский
• Вьетнамский
• Русский
• Украинский
• Болгарский

Письменности помимо латиницы, для которых в семействе есть глифы: Кириллица. Это перечень письменностей, а не обещание поддержки каждого языка, который ими пользуется.

Наборы символов в файлах: cyrillic, cyrillic-ext, latin, latin-ext, vietnamese. Список языков — это проверка наличия нужных букв в шрифте, а не гарантия типографского качества для каждого языка.

Лицензия

Шрифты в пару к Roboto Serif

Пары подобраны по простым правилам: контрастная классификация и достаточно насыщенностей для основного текста. Это отправная точка, а не окончательный выбор.

Подключение Roboto Serif на сайте

Скачайте семейство, разместите файлы на своём сайте и подключите их в CSS. Не ссылайтесь на файлы с trendhub.net: здесь лежат урезанные файлы для превью, и их адреса меняются.

@font-face {
  font-family: "Roboto Serif";
  src: url("/assets/fonts/RobotoSerif-Italic-VariableFont_GRAD%2Copsz%2Cwdth%2Cwght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Roboto Serif";
  src: url("/assets/fonts/RobotoSerif-VariableFont_GRAD%2Copsz%2Cwdth%2Cwght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Roboto Serif", serif;
}

Или подключите шрифт из официального источника. Google Fonts отдаёт Roboto Serif с такой разметкой:

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto+Serif:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">

Что важно знать

Ширина меняется в обе стороны

Ширина по умолчанию — 100; ось сжимает шрифт до 50 и растягивает до 150.

Оптический размер по умолчанию — 20

Ось opsz идёт от 8 до 144 и стоит на 20, пока приложение не задаст другое значение.

Два вариативных файла

Прямое начертание и курсив — отдельные файлы, и в каждом доступны все четыре оси.

Вопросы и ответы

Подборки с Roboto Serif

• Вариативные шрифты с осью оптического размера

  Вариативные семейства, которые перерисовываются под размер набора: крепче и свободнее в мелком, тоньше и плотнее в крупном.

• Шрифтовые системы: гротеск, антиква и моноширинный в паре

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

Похожие шрифты

Другие семейства той же классификации, по числу общих тегов назначения. Все шрифты в категории «Антиква»