Text

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

Uses Tailwind CSS font size scaling.

Copy
import { Text } from 'minerva-ui';

Text
<Text>Text</Text>
<Text>Text</Text>

Text Font Sizes#

Extra Small Text
Small Text
Medium Text
Large Text
Extra Large Text
2x Large Text
<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.