Bitter

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

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

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

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

О шрифте Bitter

Bitter — брусковое семейство, которое Sol Matas нарисовала для чтения на компьютерах и других устройствах. Работа началась на пиксельной сетке, поэтому у шрифта крупные строчные и небольшой контраст между толстыми и тонкими штрихами. Засечки равны стволам по толщине и оканчиваются прямо, а Regular темнее обычного печатного, так что абзацы получаются плотными и ровными по цвету. На образце самая светлая насыщенность — тонкая, как проволока, линия с плоскими брусками, а Black — компактный и тяжёлый. Bitter вариативный, с единственной осью насыщенности от 100 до 900; девять именованных насыщенностей и их курсивы дают 18 начертаний. В шрифтах 1 522 глифа, они покрывают латиницу, расширенную латиницу, кириллицу и вьетнамский. По официальным заметкам, интервалы подобраны вручную, поэтому кернинговых пар нужно мало. Лицензия — SIL Open Font License 1.1.

Где уместен Bitter

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

Крупные строчные и низкий контраст штрихов выбраны для экранов, где тонкие волосные линии рассыпаются.

Электронные книги и приложения для чтения

Bitter появился на волне роста электронных книг, и его тёмный Regular сохраняет цвет текста и на электронных чернилах, и на ЖК-экране.

Блоги с одним семейством на всё

Насыщенности от 100 до 900 позволяют набрать заголовки, текст и подписи из одних и тех же вариативных файлов.

Тексты на русском, украинском и болгарском

В 1 522 глифах есть кириллица, так что брусковый облик сохраняется и в латинском, и в кириллическом изданиях.

Заголовки и цитаты-врезки

В начертаниях ExtraBold и Black прямые бруски превращаются в выразительный акцидентный голос.

Глифы

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

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

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

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

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

Лицензия

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

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

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

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

@font-face {
  font-family: "Bitter";
  src: url("/assets/fonts/Bitter-Italic-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Bitter";
  src: url("/assets/fonts/Bitter-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Bitter", serif;
}

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

<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=Bitter:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">

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

В каталоге источника это антиква

В официальном каталоге Bitter отнесён к антикве; прямые засечки, равные стволам по толщине, делают его брусковым шрифтом.

Regular темнее обычного

Официальные заметки сообщают, что Regular толще типичного печатного, поэтому текст выглядит плотнее, чем во многих антиквах.

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

Прямое начертание и курсив — по одному вариативному файлу на диапазон от 100 до 900. Статических файлов в архиве нет.

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

Подборки с Bitter

• Шрифты для презентаций и слайдов

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

• Антиквы для долгого чтения с экрана

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

• Брусковые шрифты

  Семейства с брусковыми засечками: от геометричных и машинописных рисунков до крепких текстовых шрифтов с курсивом.

• Семейства шрифтов с девятью насыщенностями и курсивом

  Полные семейства от Thin до Black с курсивом для каждой насыщенности: восемнадцать начертаний для цельной типографской системы.

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

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