DNA — ДНК дизайн-системы
Основы UI-кита: пространственная цветовая модель, функциональные токены, шкалы и правила именования. DNA — не реализация кита, а его описание: спецификация, по которой дизайн-система строится и развивается в Figma.
Разделы
Семантика / SEM
Как всё именуется: реестр трёхбуквенных кодов, грамматики имён токенов и компонентов, шкалы шагов.
Абсолютная палитра / CLR
Сырьё цветов: 11 семейств × шкала из 40 шагов, особые WHT и BLC — 442 токена со значениями.
Функциональная палитра / FCL
263 переменные: слои, акценты, состояния, роли. Полная таблица с разрешением в абсолютные токены.
Отступы / SPC
Шкала расстояний 4–64 px: gap, padding, высоты контролов, Spacer.
Скругления / RAD
Радиусы 4–40 px; компонентный дефолт — SZS = 12 px.
Толщины / THK
Линии и обводки 1–7 px — единственная шкала без переменных.
Типографика / TXT
Матрица 84 стилей: Roboto Flex, 6 весов × прямое/курсив × 7 кеглей, с живыми образцами и метриками.
Функциональная типографика / FTY
Десять текстовых ролей в порядке Figma: HD1–HD3, PAR, PRP/PRA/PRN, QTE, QTE_AUT, FTN.
Градиенты высоты / GRD
«Свет сверху» для приподнятых элементов: 8 градиентов ABV для PRM и ACC.