Text

A primitive useful for rendering text.

With Modulz, our goal is to fix the disconnect between digital product teams.

Props

PropTypeDescription
childrenReactNodeThe content to render
size0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10The size to apply
fontWeight400 | 500The font weight to apply
truncateBooleanWhether it should truncate or not

System props

fontFamily
fontStyle
fontWeight
lineHeight
margin
padding
textAlign
textColor

Examples

Size

There are 11 sizes to choose from. Each size handles its own font-size and letter-spacing accordingly.

Text component

Text component

Text component

Text component

Text component

Text component

Text component

Text component

Text component

Text component

Text component

Font weight

There are 2 weight options to choose from.

Text component

Text component

Text truncation

When true this will truncate your text based on its maximum width.

With Modulz, our goal is to fix the disconnect between digital product teams.