Text

A text component is a primitive component matching Hopper's typography type scale.

Props

size?

The Typography Type Scale to use.

Defaults to md.
style?
elementType?
className?
id?

Examples

Sizes

You can alter the size of the text by specifying a size prop. The available sizes match the Hopper Typography Type Scale — a type scale is a set of font-size and line-height pairs.

Inherit

You can also alter the size to match the parent element's type scale by using the inherit size.

Nested

The Text component can be nested within other Text components and inherit the parent's size by default.