Палитра, типографика, компоненты и механика работы — от потока сообщений до DLP. Всё, что нужно, чтобы собрать рабочие экраны.
Каждый токен показан вместе с UI-фрагментом, где он работает. Navy — первичный, amber — только для акцента, семантические цвета — для статусов и классификации документов.
Три гарнитуры, каждая — со своей ролью. Ниже показаны типичные места применения: от заголовка экрана до моноширинного времени в пузыре.
Все компоненты на 4-пиксельной сетке. Hover — тёмный вариант токена, focus — 3 px navy-600 кольцо.
Диалог подтверждения деструктивного действия.
Тени построены на одном цвете — navy-900. Чем выше уровень, тем дальше элемент от поверхности. Модальные окна — уровень 3, карточки — уровень 2, строки таблицы — уровень 1.
--shadow-1
--shadow-2
--shadow-3
Кликните по отделу — увидите, кто с кем переписывается внутри. Кликните по паре — увидите имитацию диалога, как человек набирает, стирает и пересылает сообщения. Линии с замком — защищённые E2EE‑каналы руководителей: внутри них даже DLP видит только шум.
Чтобы написать в другой отдел, нужно отправить запрос. Запустите сценарий — увидите реакцию руководителя смены, таймер согласования и результат (approve / reject / escalate).
Web-десктоп, мобильный web, iOS, macOS, Windows — с компонентами, реальными состояниями и шаблонами.
Линейный паттерн со взглядом сверху — самолёты, пунктирные маршруты, контейнеры, метки портов, башни КДП. Используется как фон чата, заполнитель пустого состояния, обложка раздела. Один цвет — navy 800, три плотности — dense / medium / sparse.
assets/illustrations.svg.
Только контурные, currentColor, один стиль. Размер 16 / 20 / 24 px и толщина — переключаются. Поиск по имени.