Размер текста (text-size)link

https://dev.ru.simai.io/ru/ui/utility/typography/text-size.php

Количество поддерживаемых размеров шрифта уменьшилось с 13 до 12, а также обновлены соответствующие переменные и классы. Данные модификаторы изменяют размер шрифта и высоту строки одновременно.

Таблица классовlink

Класс	Свойства
.text-1/4	font-size: var(`--sf-text-size-1/4`); line-height: var(`--sf-text-height-1/4`);
.text-1/3	font-size: var(`--sf-text-size-1/3`); line-height: var(`--sf-text-height-1/3`);
.text-1/2	font-size: var(`--sf-text-size-1/2`); line-height: var(`--sf-text-height-1/2`);
.text-1	font-size: var(`--sf-text-size-1`); line-height: var(`--sf-text-height-1`);
.text-2	font-size: var(`--sf-text-size-2`); line-height: var(`--sf-text-height-2`);
.text-3	font-size: var(`--sf-text-size-3`); line-height: var(`--sf-text-height-3`);
.text-4	font-size: var(`--sf-text-size-4`); line-height: var(`--sf-text-height-4`);
.text-5	font-size: var(`--sf-text-size-5`); line-height: var(`--sf-text-height-5`);
.text-6	font-size: var(`--sf-text-size-6`); line-height: var(`--sf-text-height-6`);
.text-7	font-size: var(`--sf-text-size-7`); line-height: var(`--sf-text-height-7`);
.text-8	font-size: var(`--sf-text-size-8`); line-height: var(`--sf-text-height-8`);
.text-9	font-size: var(`--sf-text-size-9`); line-height: var(`--sf-text-height-9`);
.text-10	font-size: var(`--sf-text-size-10`); line-height: var(`--sf-text-height-10`);
.text-11	font-size: var(`--sf-text-size-11`); line-height: var(`--sf-text-height-11`);
.text-12	font-size: var(`--sf-text-size-12`); line-height: var(`--sf-text-height-12`);

Примечание: Ранее существовал класс text-13, но теперь максимально доступный размер — text-12.

Пример использованияlink

Текст меньше базового размера:link

<p class="text-1/4">Очень мелкий текст</p>
<p class="text-1/3">Меньше базового</p>
<p class="text-1/2">Почти базовый</p>

Базовый размер текста:link

<p class="text-1">Базовый размер текста</p>

Текст больше базового размера:link

<p class="text-2">Чуть больше базового</p>
<p class="text-3">Ещё крупнее</p>
<p class="text-12">Максимальный размер текста</p>

Адаптивностьlink

Для установки размера шрифта начиная с определённой контрольной точки (sm, md, lg, xl) добавьте префикс. Например:

<p class="md:text-2">Этот текст станет размером text-2 начиная с размера экрана md</p>