Использование дополнительных палитр помимо первичных, вторичных и ошибок

Question

Я могу создать тему и заменить палитру по умолчанию следующим образом:

const theme = createMuiTheme({
    primary: {
        main: '#aa2222',
    },
    extra: {
        main: '#22aa22',
    },
});

Это автоматически устанавливает theme.primary.light и theme.primary.dark. Однако он не устанавливает эквивалентные значения яркости и света для объекта extra.

Есть ли способ сделать это для пользовательских элементов, таких как extra, без необходимости вручную вычислять значения RGB? Или я ограничен только primary, secondary и error, которые рассчитываются автоматически?

Answer 1

сработало это. Это добавляется в конец кода в вопросе выше:

theme.palette.augmentColor(theme.palette.extra, 500, 300, 700);

Три числовых параметра - это значения mainShade, lightShade и darkShade. Вот те, которые используются для палитр по умолчанию:

augmentColor(primary, 500, 300, 700);
augmentColor(secondary, 'A400', 'A200', 'A700');
augmentColor(error, 500, 300, 700);

Я думаю, что они есть, так что вы можете настроить яркость или затемнение цветов в случае, если значение по умолчанию недостаточно для чтения.