As Dupocas said, it is the way of standardize the text.
Using a Typography you can standardize all the categories of text. For example, if you want all your titles to have the same size, font, weight … you can use it like this:
<Typography variant="h1">My Title</Typography>
For all your subtitles
<Typography variant="subtitle1">My SubTitle</Typography>
With that component, you don’t have to add a div with a specific className to your text in order to set specific styles. They all are applied on the Typography by default.
Typography have more properties you can pass, like “component” which let you choose the type of html tag to wrap your text. That wasn’t the cases in previouse versions
<Typography variant="body1" component="p">
My Text
</Typography>
Material UI is a great library, making choices for you but letting you make your own choices. All the variants can be customized. You can take a look at Customization section to know how.
Please take look to Typography “API” section, it is useful and helpful.
Hope its helps.