Дизайн-система Markt

Токени й компоненти. Кольори можна перевизначити через «⚙ Tweaks» у правому верхньому куті.

Кольори

Брендові

Primary
--primary
#FFCB05
Dark
--text
#0B0F14
On Primary
--on-primary
#0B0F14

Нейтральні

Background
--bg
#FFFFFF
Surface
--surface
#F7F8FA
Surface 2
--surface-2
#EEF0F4
Border
--border
#E4E7EC
Text muted
--text-muted
#5A6473
Text soft
--text-soft
#8B95A4

Семантичні

Success
#16A34A
Error / Urgent
#DC2626
Info / TOP
#2563EB
VIP / Premium
#E6A500

Типографіка

Manrope — основний шрифт. Кириличні та латинські накреслення, 400-800.

H1 · 40px · 700
Знайдіть усе в Києві
H2 · 28px · 700
Свіжі оголошення
H3 · 20px · 700
VIP та Premium
H4 · 17px · 700
Категорії новин
Body · 15px · 400
Розгляну розумний торг при огляді. Можлива перевірка на будь-якому СТО за рахунок покупця.
Small · 13px · 400
Опубліковано 16 травня · 1 248 переглядів
Tiny · 12px · 700
BADGE / META

Spacing

Шкала 4px. Використовується для padding, gap, margin.

--s-1 · 4px
--s-2 · 8px
--s-3 · 12px
--s-4 · 16px
--s-5 · 20px
--s-6 · 24px
--s-8 · 32px
--s-10 · 40px
--s-12 · 48px
--s-16 · 64px

Радіус та тіні

--r-sm · 6px
--r-md · 8px
--r-lg · 12px
--r-xl · 16px
Shadow 1
Shadow 2
Shadow 3

Кнопки

Бейджі

VIP TOP Терміново Нове Перевірено Бізнес Аналітика Реклама

Поля вводу

Карточки оголошень

Чипи

Іконки

Custom line-set, stroke 1.7px. Підтримка ~40 категорійних і UI-іконок.