我可以创建一个主题并像这样替换默认调色板:
const theme = createMuiTheme({
primary: {
main: '#aa2222',
},
extra: {
main: '#22aa22',
},
});
这会自动设置 theme.primary.light
和 theme.primary.dark
。但是,它不会为 extra
对象设置等效的明暗值。
有没有一种方法可以在无需手动计算 RGB 值的情况下为 extra
等自定义元素执行此操作?还是我仅限于自动计算 primary
、secondary
和 error
?
最佳答案
解决了这个问题。这被添加到上述问题的代码末尾:
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);
我认为它们在那里,因此您可以调整颜色变亮或变暗的程度,以防默认设置的可读性不够。
关于material-ui - 使用除主要、次要和错误之外的其他调色板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50097207/