Design System / Foundations / Typography
Типографика
Две семьи, осознанная иерархия. Commissioner несёт вес и характер, Inter — тихую читаемость. Никогда больше двух весов на экране.
Семьи
Сплит heading/body — осознанное решение. Commissioner даёт институциональный вес заголовкам; Inter оставляет body спокойным и читаемым на длинных сессиях. Fallback — системный sans.
Heading · h1–h3 · caps-labels
Commissioner
Геометричный гротеск с широкими буквами. Используется на заголовках, числах метрик, label-caps категорий.
Body · UI · tables
Inter
Нейтральный sans с превосходной читаемостью на экране. Body, кнопки, формы, таблицы — везде, где живёт повседневный UI текст.
Шкала
Семантическая шкала. Не называем размеры в px — называем по роли. h1 на экране — один. h2 — заголовок секции. body-md — дефолт.
Встраиваем ИИ в бизнес.
Что мы делаем
Стратегический аналитик
Наш подход
От стратегии до продакшена: помогаем компаниям внедрять ИИ осознанно — обучаем команды, проектируем и запускаем системы.
Дефолтный body. Используется в карточках, списках, описаниях продуктов и большинстве UI-контекстов.
Captions, hints, supporting copy. По умолчанию — muted-foreground. AA-контраст ниже 14px не гарантирован — использовать с осторожностью.
Пары в контексте
Как шкала собирается в реальные блоки. Каждая пара — конкретный паттерн с живых страниц.
Наш подход
Что мы делаем
Понятные сервисы. Практические решения. Архитектурная точность.
Решения
Стратегический аналитик
ИИ-агент, который читает рынок и даёт рекомендации команде стратегии — ежедневно, в контексте вашей отрасли.
Правила
| Правило | Объяснение | НЕ делать |
|---|---|---|
| Не больше двух весов на экране | Обычно — 400 body + 700 heading. Третий вес — только если он несёт смысл. | Mixing 400/500/600/700/800 на одной странице. |
| Один h1 на страницу | h1 — заголовок страницы. h2 — секции. h3 — карточки внутри секций. | Несколько h1, или h2 без h1, или skip h2 → h4. |
| Sentence case | Заголовки — sentence case. Только label-caps в UPPERCASE с tracking 0.125em. | Title Case на Каждом Слове в заголовке. |
| Numerics через тонкий пробел | 1 000+, 300+ млн ₽. Thousand separator —  . |
1,000+ или 1000+ без разделителя. |
| Кавычки «ёлочки» | Русский текст использует «…». Внутри — „…". |
" … " или '…' в русском теле. |
| text-wrap: pretty / balance | Заголовки — balance; параграфы — pretty. Снимает orphan-проблему. |
Полагаться на default wrap — получаются вдовы и сироты. |
| Без <24px на слайдах | На 1920×1080 текст не меньше 24px. На печати — не меньше 12pt. | Decorative 11px footnotes на слайдах. |
Принципы
- Типографика — основной инструмент. Если можно решить вопрос шрифтом, не добавляем картинку или иконку.
- Иерархия через размер и вес, не через цвет.
- Заголовки — смысловые, не декоративные. Нет «красивых» h1 ради вёрстки.
- Body leading щедрый — 1.6–1.7. Воздух между строк — часть голоса.
- Без italic кроме редких
consequence-строк в pain-карточках.