Typography

Preset text styles: headings, lead, muted, code and blockquote.

TypographyProps packages/core/src/form-controls.ts:353 ↗

Import

import { Typography } from "@tarve/core";

Usage

Typography.tsx

import { Column, Typography } from "@tarve/core";

<Column gap={8}>
  <Typography variant="h2">Release notes</Typography>
  <Typography variant="lead">Everything new in this version.</Typography>
  <Typography variant="muted">Updated today</Typography>
  <Typography variant="code">bun add @tarve/core</Typography>
</Column>

Props

Prop	Type	Default
`variant`	`TypographyVariant`	`"p"`

Common props

Shared by every component. See descriptions →

childrenhighlightidkeymotionFromonHighlightonPasteonTransitionEndrovingGroupstyle

Types

TypographyVariant

type TypographyVariant = "h1" | "h2" | "h3" | "h4" | "p" | "lead" | "large" | "small" | "muted" | "code" | "blockquote";