Google Sans Flex

Попробовать Google Sans Flex

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

• Thin 100Google Sans Flex Thin
• ExtraLight 200Google Sans Flex ExtraLight
• Light 300Google Sans Flex Light
• Regular 400Google Sans Flex Regular
• Medium 500Google Sans Flex Medium
• SemiBold 600Google Sans Flex SemiBold
• Bold 700Google Sans Flex Bold
• ExtraBold 800Google Sans Flex ExtraBold
• Black 900Google Sans Flex Black

Google Sans Flex — вариативный шрифт: весь диапазон насыщенностей в архиве умещается в одном файле, а названные выше насыщенности — точки в этом диапазоне. Отдельного файла с курсивом нет: наклонные начертания задаются осью «Наклон».

О шрифте Google Sans Flex

Google Sans Flex — геометрический гротеск, сделанный как один вариативный шрифт с шестью осями. На образце «o» близка к окружности, «a» двухэтажная, «g» одноэтажная, а штрихи сохраняют ровную толщину от Thin до Black. Насыщенность идёт от 1 до 1000, то есть шире именованных насыщенностей от 100 до 900; ширина — от 25 до 151 (по умолчанию 100); оптический размер — от 6 до 144; Grade и Roundness — каждая от 0 до 100; наклон — от 0 до −10. Отдельного файла с курсивом нет, поэтому наклонный текст получают с помощью оси наклона. В 682 глифах — латиница, расширенная латиница и вьетнамский. Автором шрифта названа Google, лицензия — SIL Open Font License 1.1.

Где уместен Google Sans Flex

Заголовки, подстраивающиеся под контейнер

Ось ширины идёт от 25 до 151, поэтому один заголовок можно сжать до узкой карточки или растянуть на весь баннер.

Интерфейсы от подписей до главного текста

Ось оптического размера идёт от 6 до 144, и один файл покрывает и самые мелкие подписи, и самые крупные заголовки.

Системы брендов с мягким или строгим голосом

Ось Roundness идёт от 0 до 100 и даёт на тех же скелетах букв второй, более округлый вариант.

Анимированная и интерактивная типографика

Шесть непрерывных осей позволяют плавно менять насыщенность, ширину или наклон в ответ на наведение, прокрутку или состояние.

Тонкая настройка насыщенности

Насыщенность можно задать в любой точке от 1 до 1000, а ось Grade добавляет ещё одну подстройку от 0 до 100.

Глифы

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

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

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

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

Лицензия

Шрифты в пару к Google Sans Flex

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

Подключение Google Sans Flex на сайте

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

@font-face {
  font-family: "Google Sans Flex";
  src: url("/assets/fonts/GoogleSansFlex-VariableFont_GRAD%2CROND%2Copsz%2Cslnt%2Cwdth%2Cwght.ttf") format("truetype");
  font-weight: 1 1000;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Google Sans Flex", sans-serif;
}

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

<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=Google+Sans+Flex:wght@1..1000&display=swap" rel="stylesheet">

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

Один файл, курсива нет

Пакет — единственный вариативный шрифт. Наклонный текст получают с помощью оси наклона, которая идёт от 0 до −10.

Насыщенность выходит за пределы именованных

Девять именованных насыщенностей лежат в диапазоне от 100 до 900, но сама ось идёт от 1 до 1000.

Из крупных письменностей — только латиница и вьетнамский

Кириллического и греческого подмножеств нет.

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

Подборки с Google Sans Flex

• Вариативные шрифты с необычными осями

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

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

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