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 — компоненты, потребляющие эти семейства через токены.