Material Design颜色主题中的三种以上颜色

时间:2019-03-05 15:30:16

标签: javascript material-design material-ui

在Material Design用户界面中,文档说明了我们可以将自定义颜色分配给主要/辅助调色板。

import { createMuiTheme } from '@material-ui/core/styles';

const theme = createMuiTheme({
  palette: {
    primary: {
      lighter: '#~~~~~~', //Hopefully
      light: '#757ce8',
      main: '#3f50b5',
      dark: '#002884',
      darker: '#~~~~~~', //Also this
      contrastText: '#fff',
    },
    secondary: {
      light: '#ff7961',
      main: '#f44336',
      dark: '#ba000d',
      contrastText: '#000',
    },
  },
});

但这是否限制为每层最多三种颜色?我的调色板有8种阴影,并希望将它们分配给主要图层。实际上,我不需要第二层,因此我现在最多可以分配6种颜色,但仍然不够。

例如,参考其他库,Fabric UI提供了具有更多颜色的调色板。在Material Design UI中制作类似的自定义调色板容易吗?

import { loadTheme } from 'office-ui-fabric-react';

loadTheme({
  palette: {
    themePrimary: '#967f19',
    themeLighterAlt: '#fbf9f2',
    themeLighter: '#eee8cf',
    themeLight: '#e0d5a8',
    themeTertiary: '#c0af61',
    themeSecondary: '#a38d2c',
    themeDarkAlt: '#877317',
    themeDark: '#726113',
    themeDarker: '#54470e',
  }
});

0 个答案:

没有答案