Sometimes, we want to set Typography text color in React Material UI.

In this article, we’ll look at how to set Typography text color in React Material UI.

How to set Typography text color in React Material UI?

To set Typography text color in React Material UI, we can set the color and variant props.

For instance, we write:

import * as React from "react";
import Typography from "@material-ui/core/Typography";

export default function App() {
  return (
    <div>
      <Typography gutterBottom variant="h2" component="h2" color="secondary">
        hello world
      </Typography>
    </div>
  );
}

We set the variant prop to set the size of the text.

component sets the component to render the text as.

The color prop sets the color.

As a result, we should see large red text displayed on screen.

Conclusion

To set Typography text color in React Material UI, we can set the color and variant props.