Fulldev UI

Docs Components Blocks

Text

The quick brown fox jumps over the lazy dog

---
import Text from 'fulldev-ui/components/Text.astro'
---

<Text>The quick brown fox jumps over the lazy dog</Text>

Props

PropTypeDefault
size'sm' | 'md' | 'lg'-
color'base' | 'brand'base
contrastboolean-
leadboolean-
htmlstring-
textstring-
asHTMLTagp
HTML AttributesPolymorphic<p>-

Examples

The quick brown fox jumps over the lazy dog

The quick brown fox jumps over the lazy dog

The quick brown fox jumps over the lazy dog

---
import Text from 'fulldev-ui/components/Text.astro'
---

<Text size="sm">The quick brown fox jumps over the lazy dog</Text>
<Text size="md">The quick brown fox jumps over the lazy dog</Text>
<Text size="lg">The quick brown fox jumps over the lazy dog</Text>

The quick brown fox jumps over the lazy dog

The quick brown fox jumps over the lazy dog

The quick brown fox jumps over the lazy dog

---
import Text from 'fulldev-ui/components/Text.astro'
---

<Text lead size="sm">The quick brown fox jumps over the lazy dog</Text>
<Text lead size="md">The quick brown fox jumps over the lazy dog</Text>
<Text lead size="lg">The quick brown fox jumps over the lazy dog</Text>

The quick brown fox jumps

The quick brown fox jumps

---
import Text from 'fulldev-ui/components/Text.astro'
---

<Text color="base">The quick brown fox jumps</Text>
<Text color="brand">The quick brown fox jumps</Text>

The quick brown fox jumps

The quick brown fox jumps

---
import Text from 'fulldev-ui/components/Text.astro'
---

<Text>The quick brown fox jumps</Text>
<Text contrast>The quick brown fox jumps</Text>