Zilla Slab Highlight

Попробовать Zilla Slab Highlight

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

• Regular 400Zilla Slab Highlight Regular
• Bold 700Zilla Slab Highlight Bold

О шрифте Zilla Slab Highlight

Zilla Slab Highlight — брусковый шрифт, в котором буква — это пустое место: каждый глиф представляет собой закрашенный прямоугольник с вырезанным в нём знаком. На образце соседние буквы сливаются в одну непрерывную полосу, а пробел между словами её прерывает, так что каждое слово становится отдельным блоком. Внутри блоков стоят брусковые буквы с плоскими засечками без скруглений и плавными кривыми, а цифры старостильные: они поднимаются и опускаются, как строчные. В семействе 2 начертания, Regular 400 и Bold 700, без курсива, и это не вариативный шрифт. Его 982 глифа покрывают латиницу западно- и центральноевропейских языков. Typotheque нарисовала шрифт в проекте под руководством Mozilla, чей основной шрифт — Zilla Slab, а в уведомлении об авторских правах названа The Mozilla Foundation. Шрифт распространяется по SIL Open Font License 1.1.

Где уместен Zilla Slab Highlight

Выделенные слова в заголовке

Если набрать одно слово шрифтом Zilla Slab Highlight, за ним появится сплошная полоса, и рисовать рамку в макете не нужно.

Метки, теги и бейджи

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

Заголовки поверх фотографий

Полоса входит в каждый глиф, поэтому подпись сохраняет собственный фон поверх пёстрого изображения.

Выносные цитаты и врезки

Regular и Bold дают два уровня выделения внутри стиля с подсветкой.

Подписи на языках Центральной Европы

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

Глифы

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

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

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

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

Лицензия

Шрифты в пару к Zilla Slab Highlight

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

Подключение Zilla Slab Highlight на сайте

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

@font-face {
  font-family: "Zilla Slab Highlight";
  src: url("/assets/fonts/ZillaSlabHighlight-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Zilla Slab Highlight";
  src: url("/assets/fonts/ZillaSlabHighlight-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Zilla Slab Highlight", serif;
}

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

<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=Zilla+Slab+Highlight:wght@400;700&display=swap" rel="stylesheet">

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

Блок — это сам глиф

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

Пробелы разрывают полосу

На образце каждое слово образует отдельный блок, а на месте каждого пробела остаётся промежуток.

Курсива нет

В Zilla Slab Highlight есть только Regular и Bold; курсив относится к основному семейству Zilla Slab.

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

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

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