Fonts
@cloud-ru/ds-fonts — служебный пакет без runtime-кода. Содержит @font-face-декларации SB Sans Interface (woff2/woff), а также подключает Inter и Roboto Mono из Google Fonts. Подключается один раз на корневом уровне приложения; компоненты дизайн-системы дальше ссылаются на эти семейства через токены типографики.
Когда использовать
- Хост-приложение использует компоненты
@ds/*и хочет получить тот же типографический стек, что в Storybook и docs. - Нужны кастомные веса SB Sans Interface (300/400/500/600/700) — пакет регистрирует все варианты.
Анатомия
Семейства
- SB Sans Interface — основной интерфейсный шрифт, локально (woff2/woff в
packages/fonts/fonts/). - Inter — fallback и дополнительные акценты, по сети из Google Fonts.
- Roboto Mono — моноширинный, для кода и числовых таблиц.
Веса SB Sans Interface
300 Light, 400 Regular, 500 Medium, 600 Semibold, 700 Bold — каждый вариант зарегистрирован отдельным @font-face с font-display: swap.
Установка
pnpm add @cloud-ru/ds-fonts
Через SCSS (рекомендовано)
@use '@cloud-ru/ds-fonts/scss';
Через CSS
import '@cloud-ru/ds-fonts/css'
Подключение работает в любой современной сборке: SCSS-импорт даёт инкрементальные пересборки, CSS-вариант — статический файл для no-bundler сценариев.
Смотри также
- Typography — компоненты, потребляющие эти семейства через токены.