Categories
React Answers

How to set Typography text color in React Material UI?

Spread the love

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.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *