Typography

Use typography to present your design and content as clearly and efficiently as possible.

Source

View source code

Issues

Report an issue

Package

@rootui/typography

Preview

This is a preview

variant

color

weight

1<e>
2  This is a preview
3</e>

1<Typography></Typography>

Package

Shadcn CLI

Manual

Note

Please ensure your local environment is fully configured as instructed in the getting started guide.

npm

yarn

pnpm

bun

npm install @rootui/typography

1import { Typography } from "@rootui/typography";
2
3export default function Page() {
4  return (
5    <Typography>Hello</Typography>
6  )
7}

Prop	Type	Default
`variant`	`'h1' \| 'h2' \| 'h3' \| 'body' \| 'body-sm' \| 'caption'`	`'body'`

`color`	`'default' \| 'subtle' \| 'primary' \| 'secondary' \| 'info' \| 'success' \| 'warning' \| 'danger' \| 'magic'`	`'default'`

`weight`	`100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900`