Brand
Changelog v1.4

Typography

Typography presents content clearly and efficiently using the Snyder type scale mapped to MUI variants.

Headings

h1. Heading

h2. Heading

h3. Heading

h4. Heading

h5. Heading
h6. Heading

Body & Subtitles

subtitle1. Used for section labels and secondary headings.
subtitle2. Smaller subtitle for less prominent sections.

body1. The default text style for paragraph content. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci.

body2. Smaller body text for secondary content and descriptions. Used in cards, captions, and supplementary information.


Utility Variants

button text — used in buttons and actionscaption text — small annotations and helper textoverline text — labels and category markers

Colors

Primary text color

Secondary text color

Disabled text color

Primary theme color

Secondary theme color

Error theme color

Success theme color


Alignment

Left aligned text

Center aligned text

Right aligned text

Usage

import Typography from '@mui/material/Typography';

<Typography variant="h1">Heading 1</Typography>
<Typography variant="body1">Body text</Typography>
<Typography variant="caption" color="text.secondary">Caption</Typography>