Typography

Customize Theme Typography

You can customize the typography used in the theme as well from the central place.

For instance, if you want to change font-weight the typography h5 to.900 To do that, open src\themes\typography.tsx and update as below:

typography.ts
// material-ui
import { Theme, TypographyVariantsOptions } from '@mui/material/styles';

/**
 * Typography used in the theme
 */
  
export default function Typography(theme: Theme, borderRadius: number, fontFamily: FontFamily): TypographyVariantsOptions {
    return {
        ...
        h5: {
            ...
            fontWeight: 900 // changed this to make it 900 from 500
        },
        ...
    };
});

This will apply to all places where you used Typography variants as h5

<Typography variant="h5"...>

Last updated

Was this helpful?