Text

Size variants

Size 100Size 200Size 300Size 400Size 500Size 600Size 700Size 800Size 900Size 1000

<FuiText size="100">Size 100</FuiText>
<FuiText size="500">Size 500</FuiText>
<FuiText size="1000">Size 1000</FuiText>

Weight variants

RegularMediumSemiboldBold

<FuiText weight="regular">Regular</FuiText>
<FuiText weight="bold">Bold</FuiText>

Decoration

ItalicUnderlineStrikethrough

<FuiText italic>Italic</FuiText>
<FuiText underline>Underline</FuiText>

As prop

As h1

As h2

As paragraph

<FuiText as="h1">As h1</FuiText>
<FuiText as="p">As paragraph</FuiText>

Props

Prop	Type	Default	Description
size	100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000	300	Font size
weight	regular | medium | semibold | bold	regular	Font weight
align	start | center | end	start	Text alignment
italic	boolean	false	Italic style
underline	boolean	false	Underline decoration
strikethrough	boolean	false	Strikethrough decoration
truncate	boolean	false	Single-line truncation
as	span | p | h1 | h2 | h3 | h4 | h5 | h6	span	Rendered element