Material-UI v1：テーマ設定にカスタムカラーを使用する

Question

これはかなりシンプルなことですが、私はmaterial-uiにかなり新しいです。私はmaterial-ui v1を使用しています。テーマ。これが私のテーマオブジェクトは、カスタムカラーを使用せずにどのように見えるかです：

原色で

import { createMuiTheme } from 'material-ui-next/styles'; 
import blue from 'material-ui-next/colors/purple'; 
import green from 'material-ui-next/colors/green'; 
import red from 'material-ui-next/colors/red'; 


const theme = createMuiTheme({ 
    palette: { 
     primary: green, 
     secondary: { 
      ...green, 
     }, 
     error: red, 
    }, 
}); 


export default theme; 

、私は「＃6699CC」である私のカスタムカラーを使用していました。私は主に割り当てる場合：

「材質-UI：： '＃6699CC'、それは私に次のエラーを与える が50,100,200,300,400,500,600,700,800,900、A100、A200、A400、A700は、contrastDefaultColor を参照してください：原色は、次の色合いが欠落していますデフォルトの色、藍、またはピンク、 材料-UI /色からエクスポートとしてbundle.js @警告：37805"

これは0.19ベータリリースで動作するように使用されたが、それはV1-ベータでは動作しません。 。誰もがこれで私を助けてくれる？

Answer 1

Colorのドキュメントを確認してください。私は色を選択しながら色相を設定する必要があります。

import { red, purple } from 'material-ui/colors'; 

const primary = red[500]; // #F44336 
const accent = purple['A200']; // #E040FB 

更新： 私はあなたが一緒に色合いや色の値を設定するので、材料-UIはそれをレンダリングする必要のある色を知ることができなければならない場合がありますdocsから読むと。

以下のJSONオブジェクトに従ってプライマリカラーを設定してください。

{ 
    primary: { 
     50: "#e3f2fd", 
     100: "#bbdefb", 
     200: "#90caf9", 
     300: "#64b5f6", 
     400: "#42a5f5", 
     500: "#2196f3", 
     600: "#1e88e5", 
     700: "#1976d2", 
     800: "#1565c0", 
     900: "#0d47a1", 
     A100: "#82b1ff", 
     A200: "#448aff", 
     A400: "#2979ff", 
     A700: "#2962ff", 
     contrastDefaultColor: "light" 
    } 
} 

PS：あなたは/colors/purple