javascript - Hur ändrar man färg på Material UI-typografi?

Jag vill ändra färgen på bara denna typografi till röd. Är det möjligt?

return <Typography color='primary'>Login Invalid</Typography>

Jag hittade detta online men jag är inte säker på hur man använder det eftersom det inte finns någon theme={colortheme}-egenskap på Typography själv och det ger mig ett fel. Jag vill inte ändra hela temat från ThemeProvider.

const colortheme = createMuiTheme({
  palette: {
    primary: { main: "#e91e63", contrastText: "#fff" },
    secondary: { main: "#03a9f4", contrastText: "#fff" }
  }
});
``

Svar #1

Jag tror att det bästa sättet att göra detta är att omsluta ThemeProvider runt Typography-komponenten, jag skapade en sandbox för det här här https://codesandbox.io/s/blue-smoke-4zdnu. I princip vill du

return (
    <ThemeProvider theme={colortheme}>
      <Typography color="secondary" variant="h1">
        Login Invalid
      </Typography>
    </ThemeProvider>
  );