Text

The <Text /> component replaces <p> or <div>.

Uses Tailwind CSS font size scaling.

import { Text } from 'minerva-ui'

Preview

Text

Source

<Text>Text</Text>

<Text>Text</Text>

Text Font Sizes

Preview

Extra Small Text

Small Text

Medium Text

Large Text

Extra Large Text

2x Large Text

Source

<Stack> <Text fontSize="xs">Extra Small Text</Text> <Text fontSize="sm">Small Text</Text> <Text fontSize="md">Medium Text</Text> <Text fontSize="lg">Large Text</Text> <Text fontSize="xl">Extra Large Text</Text> <Text fontSize="2xl">2x Large Text</Text> </Stack>

<Stack>
  <Text fontSize="xs">Extra Small Text</Text>
  <Text fontSize="sm">Small Text</Text>
  <Text fontSize="md">Medium Text</Text>
  <Text fontSize="lg">Large Text</Text>
  <Text fontSize="xl">Extra Large Text</Text>
  <Text fontSize="2xl">2x Large Text</Text>
</Stack>

Props

These are props related to the Text component.

Name	Type	Is Required	Default	Description
lineHeight	string	optional	normal	Sets line height of font