Figma: https://www.figma.com/file/WMgGmpb1P7iz8QGPdsygtI/Theme?node-id=1%3A1660

Как правило, в рамках одного бренда может существовать 3 цветовых темы:

• Default — светлый фон с яркими отображением акцентных контролов и тёмным отображением текста (как правило это используется по-умолчанию)
• Brand — яркий фон со светлым отображением акцентных контролов и текста (в основном применяется для вставки маркетинговых или партнёрских блоков)
• Inverse — тёмный фон с яркими отображением акцентных контролов и светлым отображением текста (чаще всего используется для отбивки меню/футера или для «ночной» темы)

Базовые цвета

Цвета фона

Цвета текста

Цветовые переменные имеют семантическое значение, поэтому названы по смыслу. Таким образом мы можем перекрашивать интерфейс просто изменяя значения в переменных. Фоновые переменные имеют префикс color-bg-, типографические — color-typo-, переменные для контролов — color-control-*.