Всем привет! Как лучше описать и составить интерфейсную палитру для дизайн-системы? Изначально сделала для брендбука палитру, добавляя к primary белый и чёрный с шагом 4% (прикрепляю). Пользуюсь для задач по графике и интерфейсам, использую не все цвета. В интерфейсах помимо самого primary использую очень светлые (primary + 88 и 92% белого), иногда тёмный. При генерации плагином палитры для дизайн-системы получается следующее: 1) если делать небольшую растяжку из 5 цветов, primary 100-500 — мои светлые цвета не вписываются. 2) если делать больше шагов, растяжку 30 цветов (это получается primary 100-3000) — получается огромная бестолковая растяжка, большая часть которой не будет использоваться. Я вижу вариант забить на систему primary/100, primary/500, и просто описать несколько цветов, которые используются. Но тогда вероятно нужно делать примерно равные шаги и всё равно добавить какие-то цвета, которые не использовались, просто для системности? Поделитесь своим опытом и подходом, пожалуйста)
здесь должен был быть медиа файл, но наш сервер не резиновый: MessageMediaPhoto

Имхо отлично у материала расписано.
https://m3.material.io/styles/color/choosing-a-scheme

Использую их генератор стилей.
https://m3.material.io/blog/material-theme-builder
https://www.figma.com/community/plugin/1034969338659738588/material-theme-builder

Спасибо) использовала это для интерфейсной палитры в прошлом году, в итоге она у меня же не прижилась. Отличный момент перечитать и попробовать применить к тому, что есть)

Обычно берется 10 или болле оттенков для 1 цвета. Это примитивы. Дальше эта палитра бьется на семантические единицы (между ними еще может быть прокладка с темами, если вам актуально): цвета посветлее - бэкраунды, цвета из центра набора - дивайдеры обводки, иногда состояния для компонентов типа ховеров и т.п., самая контрастная часть - все, что касается контента (акцентные цвета, тексты, иконки и т.п.) В Фигме можно создать токены из примитивов и семантических цветов, залинковав их друг с другом (primary = blue-600), при этом в семантические добавить только то, что нужно вам, а у группы примитивов поставить точку (.primitives), чтобы эти цвета не выкатились в библиотеку, и вам не мешались во время работы с ней. И ещё для интерфейсов рекомендовал бы подбирать цвета исходя из принятых норм контрастности, а не отталкиваясь от брендовых.