МЕСТО
Design System · v1.1 · синхронизировано с CRM 26.09.2026

Все правила, по которым устроен сайт mp-llc.ru

Цвет, типографика, компоненты, motion и токены — собраны из живого кода и приведены к одному источнику правды.

Цвет

Единственный насыщенный цвет — #071246 Brand Navy. Всё остальное — холодные нейтрали в гамме 226–228°.

Brand Navy
#071246
hsl(229 82% 15%)
Logo, primary CTA, hero overlay
Background
#FAFBFD
hsl(228 33% 99%)
Page bg, near-white cool
Card
#FFFFFF
hsl(0 0% 100%)
Card / header surface
Foreground
#1F2438
hsl(226 33% 18%)
Body text
Muted FG
#56649F
hsl(228 30% 48%)
Secondary copy · 5.5:1
Border
#DFE3EE
hsl(227 30% 91%)
Hairlines
Input
#868FB1
hsl(227 22% 61%)
Field border · 3:1
Accent
#E5E9F2
hsl(225 33% 93%)
Hover / focus surface

Функциональные — только состояния

Красный, янтарный и зелёный — не акценты, а состояния: ошибка, «в процессе», успех. Success и destructive-accent — только иконки и рамки, не текст.

Destructive
#C52020
Fill under white text · 5.8:1
Destructive accent
#EE5959
Borders, icons only
Warning
#FFFBEB
Transitional state · text #76350F
Warning accent
#DB7706
Icons only
Success
#16A249
Icons and dots only
Skeleton
#D7DBEA
Loading placeholder

Charts — нэви-рамп

Никаких новых акцентов для графиков. Только пять оттенков от Brand Navy до прохладного нейтраля.

chart-1
#071246
chart-2
#0E3382
chart-3
#5C7CEA
chart-4
#92A6F0
chart-5
#A0AAC4

Типографика

Двушрифтовая система. Inter Bold (700) — только для логотипа (mark + wordmark). Fira Sans 400/500/600/700 — всё остальное (UI, заголовки, текст). Курсив не загружен — использовать запрещено.

Веса (Fira Sans)

400 Regular
МЕСТО Aa Бб
500 Medium
МЕСТО Aa Бб
600 SemiBold
МЕСТО Aa Бб
700 Bold
МЕСТО Aa Бб

Шкала

Display · 60 / 48 / 36 px · w 600
Партнёр для бизнеса и брендов
H2 · 30 px · w 600
Системный подход к реализации
H3 · 18 px · w 600
Pop-Up пространства
Body · 16 px · w 400 · LH 1.625
Берём на себя полный цикл проекта — от идеи и концепции до производства и реализации пространства.
Body sm · 14 px · w 400
Концепции сезонных и флагманских витрин для торговых пространств.
Micro · 12 px · w 600 · UPPER · +0.15em
Ключевые направления
Wordmark · 16 px · w 700 · UPPER · +0.15em (Inter Bold)
МЕСТО

Логотип

Знак — сплошная заглавная М в Inter Bold (700). Wordmark — «МЕСТО» в Inter Bold с трекингом 0.15em. Знак и слово никогда не используются вместе — выбираем одно из двух в зависимости от контекста.

Mark · light
Mark · light
Favicon tile
Favicon tile
Mark reverse
Mark reverse
Wordmark
Wordmark

Полная папка ассетов: /design/logos/ · Растровый PNG-пак: /design/logos/png/

Компоненты

Базовые рецепты — кнопки, бейджи, инпуты, карточки. Все используют единые токены.

Кнопки

Бейджи

Pop-UpВитриныРитейлRemovedНа согласовании

Плашки

Есть несохранённые изменения
Настройки сохранены
Здесь пока ничего нет

Поле ввода

Проверьте адрес почты

Step / numbered card

01

Анализ и стратегия

Погружение в бренд, задачи маркетинга и особенности пространства.

02

Концепция

Разработка идеи, 3D-визуализация, презентация решений.

03

Производство

Подбор материалов, изготовление, контроль качества.

04

Реализация

Монтаж, технический контроль, соблюдение сроков.

CTA pattern

Запрос на проект

Оставьте запрос, чтобы получить оценку, сроки и формат реализации проекта.

Геометрия

Радиус --radius 6 px (rounded-lg; на сайте контролы rounded-md · 4 px), тень 0 2px 6px rgba(0,0,0,.08), spacing шкала кратна 4.

Радиусы

rounded-sm · 2px
rounded-md · 4px
rounded-lg · 6px
rounded-full

Тени

shadow-mesto
shadow-mesto-lg
без тени
статичная карточка