material-ui createMuiTheme palette type dark does not change textcolor to light

Question

I have set the palette type: dark in createMuiTheme and it changes the background color to dark, which is good. But the text color stays black. Shouldn't it adapt a lighter color?

CodeSandbox link : https://codesandbox.io/s/j22rvq4w2v

import React from 'react'; 
import ReactDOM from 'react-dom';
import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';
import CssBaseline from '@material-ui/core/CssBaseline';
import App from './App';

const theme = createMuiTheme({
  palette: {
    type: 'dark',
  },
});

ReactDOM.render(

<MuiThemeProvider theme={theme}>
    <React.Fragment>
        <CssBaseline />
            <App/>
    </React.Fragment>
</MuiThemeProvider>,
     document.getElementById('app'));

The app component just contains an AppBar and simple text.

Update: The version of material-ui I have, which I mentioned earlier as v1 is incorrect. Sorry about misinformationtion and it is 3.10.10

Answer 1

You are simply misinterpreting what CssBaseline is for. That component is some kind of CSS resetter, and doesn’t add any visual style — only layout, box-sizing stuff.

What you really want is the Typography component.

See the updated and working CodeSandbox.