Frantisek
Frantisek

Reputation: 7703

Unable to set theme in latest MUI v5 with ReactJS

I am building a small, simple Wiki for myself; just started learning React, although I've been working with JavaScript before.

I cannot seem to set the theme. I am trying to set the background to black. I am doing this:

  const darkMode = true;

  const theme = createTheme({
    palette: {
      type: darkMode ? 'dark' : 'light',
      background: {
        default: "#000000",
        paper: "#000000"
      }
    },
  })

And then rendering with:

<ThemeProvider theme={theme}>
...
</ThemeProvider>

codesandbox project

github repo, although it's still very young.

Any idea what I am doing wrong?

Upvotes: 0

Views: 710

Answers (2)

Belkacem Yahiaoui
Belkacem Yahiaoui

Reputation: 61

your import is wrong, you need to import ThemeProvider from /material and not material/styles, like this:

import { ThemeProvider } from "@mui/material";

Upvotes: 1

Jamie_D
Jamie_D

Reputation: 999

Add CssBaseline to the child

import CssBaseline from '@mui/material/CssBaseline';

<ThemeProvider theme={theme}>
  <CssBaseline />
...
</ThemeProvider>

See CssBaseline

Upvotes: 1

Related Questions