Syne

Попробовать Syne

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

• Regular 400Syne Regular
• Medium 500Syne Medium
• SemiBold 600Syne SemiBold
• Bold 700Syne Bold
• ExtraBold 800Syne ExtraBold

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

О шрифте Syne

Syne — семейство гротесков, ширина которого меняется вместе с насыщенностью. Regular — геометрический гротеск с круглыми чашами, одноэтажной «a» и цифрами разной высоты; с каждым шагом к ExtraBold буквы не только тяжелеют, но и расширяются, пока самое тяжёлое начертание не становится сильно растянутым, как показывают образцы насыщенностей. Lucas Descroix нарисовал семейство в 2017 году по концепции Bonjour Monde при участии Arman Mohtadji для Synesthésie, центра искусств в Сен-Дени под Парижем. George Triantafyllakos добавил греческую письменность в марте 2022 года. В Syne пять насыщенностей, от 400 до 800, в одном вариативном файле с осью насыщенности, курсива нет. В шрифте 709 глифов с латиницей, расширенной латиницей и греческим; он выпущен под SIL Open Font License 1.1.

Где уместен Syne

Айдентика культурных площадок

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

Заголовки, меняющие ширину

Поскольку Bold и ExtraBold шире, чем Regular, движение по оси насыщенности меняет и то, какую часть строки занимает заголовок.

Плакаты и обложки программ

Растянутый ExtraBold 800 заполняет лист несколькими словами, а Regular под ним набирает даты.

Анимированные заголовки в вебе

Ось насыщенности от 400 до 800 в одном файле позволяет заголовку растягиваться и утолщаться в CSS-переходе.

Макеты на греческом и латинице

Греческие буквы George Triantafyllakos следуют той же логике расширения, поэтому двуязычные заголовки ведут себя одинаково.

Глифы

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

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

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

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

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

Лицензия

Шрифты в пару к Syne

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

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

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

@font-face {
  font-family: "Syne";
  src: url("/assets/fonts/Syne-VariableFont_wght.ttf") format("truetype");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Syne", sans-serif;
}

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

<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=Syne:wght@400..800&display=swap" rel="stylesheet">

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

Тяжелее значит шире

Текст в более тяжёлой насыщенности занимает больше места по горизонтали, чем тот же текст в Regular, поэтому переносы строк меняются вместе с насыщенностью.

Нет курсива

У Syne только прямые начертания. Syne Mono и Syne Tactile — отдельные семейства.

Цифры стоят на разной высоте

На образце цифры 3, 4, 5, 7 и 9 уходят ниже базовой линии, как старостильные цифры.

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

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

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