Text

PreviousNext

Typography helper (variant → Heading / Body).

import { Text } from "@/rl-ui";

<>
<Text variant="heading-02">Heading</Text>
<Text variant="body-short-01">Body copy</Text>
</>

Examples

Variants

import { Text } from "@/rl-ui";

<>
<Text variant="heading-01">Heading 01</Text>
<Text variant="heading-02">Heading 02</Text>
<Text variant="heading-03">Heading 03</Text>
<Text variant="heading-compact-01">Compact</Text>
<Text variant="body-short-01">Body short</Text>
<Text variant="label-01">Label</Text>
<Text variant="helper-text-01">Helper</Text>
<Text variant="code">code()</Text>
</>

API

PropTypeDefaultDescription
variant"heading-01" | "heading-02" | "heading-03" | "heading-compact-01" | "body-short-01" | "label-01" | "helper-text-01" | "code""body-short-01"Typography token.
classNamestring—Additional classes.