font-stretch

Свойство font-stretch устанавливает узкое, нормальное или широкое начертание шрифта. Как и в случае font-weight, браузер не меняет рисунок шрифта, а выбирает из доступных шрифтов подходящие начертания, если они описаны в @font-face или есть в системном шрифте.

Некоторые шрифты имеют дополнительные начертания, в которых символы могут быть у́же (condensed) или шире (expanded) нормальной ширины. Если используемый вами шрифт не предполагает таких начертаний, то свойство font-stretch действовать не будет.

Возможные значения:

• normal — нормальная или «текстовая» ширина шрифта (значение по умолчанию).
• semi-condensed, condensed, extra-condensed, ultra-condensed — сжатое начертание разной степени.
• semi-expanded, expanded, extra-expanded, ultra-expanded — расширенное начертание разной степени.
• проценты — точное указание процентов. Отрицательные значения недопустимы. Границы диапазона зависят от того, какие значения поддерживает шрифт.

Интерактивный пример использования процентов в качестве значения:

Сопоставление ключевых слов с числовыми значениями:

• ultra-condensed — 50%;
• extra-condensed — 62.5%;
• condensed — 75%;
• semi-condensed — 87.5%;
• normal — 100%;
• semi-expanded — 112.5%;
• expanded — 125%;
• extra-expanded — 150%;
• ultra-expanded — 200%.

Пример использования ключевых слов в качестве значения:

💡 Google API определяет ваш браузер для обеспечения совместимости (не все браузеры поддерживают вариативность шрифтов). Но из-за неточностей, некоторые браузеры, которые её поддерживают (например Opera), все равно получают статические шрифты. Имейте это в виду при работе с Google Fonts.