Text

Display text using well-defined typographic styles.

Sizes

Text comes in 9 sizes, ranging from huge to tiny.

Nox Ui Components

<Box
  css={{
    '& > *': {
      mb: '$2',
    },
  }}
>
  <Text size="9">Nox Ui Components</Text>
  <Text size="8">Nox Ui Components</Text>
  <Text size="7">Nox Ui Components</Text>
  <Text size="6">Nox Ui Components</Text>
  <Text size="5">Nox Ui Components</Text>
  <Text size="4">Nox Ui Components</Text>
  <Text size="3">Nox Ui Components</Text>
  <Text size="2">Nox Ui Components</Text>
  <Text size="1">Nox Ui Components</Text>
</Box>

Font weights

The Text component comes with 8 different font sizes with aliases.

Nox Ui Components

Bold

Heading

Medium

Normal

Body