- https://mui.com/material-ui/api/typography/
- Single Typography component.
- Styling presets via the
variant prop (body1, body2, button, caption, h1, h2, h3, h4, h5, h6, inherit, overline, subtitle1, subtitle2).
- Customizable via props (
sx prop and other props) or classes.
- Possible to separate style and semantic meaning via
component prop.
With shadcn/ui, the UI Library is generated and put in the consumer's source code.
- https://ui.shadcn.com/docs/components/typography
- Has different components for text and headings.
- Styling presets via standalone components (h1, h2, h3, h4, p, blockquote, table, list, Inline code, Lead, Large, Small, Muted).
- Customizable via classes.
- Not possible to separate style and semantic meaning.
- https://mantine.dev/core/text/
- Has different components for text and headings.
- Text component has styling presets via size prop (xs, sm, md, lg, xl)
- Title component has styling presets via size prop (h1, h2, h3, h4, h5, h6)
- Customizable via props (
fw for fontWeight, c for color, etc.) or classes.
- Possible to separate style and semantic meaning via
order prop.
- https://ant.design/components/typography
- Has different components for text and headings.
- Title component has styling presets via level prop (1, 2, 3, 4, 5)
- Text component has no styling presets.
- Both can change color via the
type prop, which has a select numbers of semantic colors (default, secondary, success, warning, danger).
- Customizable via classes.
- Not possible to separate style and semantic meaning.
- https://www.radix-ui.com/themes/docs/components/text and https://www.radix-ui.com/themes/docs/components/heading
- Has different components for text and headings.
- Text component has styling presets via size prop (1, 2, 3, 4, 5, 6, 7, 8, 9)
- Heading component has styling presets via size prop (1, 2, 3, 4, 5, 6, 7, 8, 9)
- Customizable via classes and props.
- Possible to separate style and semantic meaning via
as prop.