Display Text
Heading used for large and short headlines to convey brand and boldness.
Feel at home with Qasa
Examples
Set element type with as
By default the DisplayText component renders as a <h2> element.
You can change the element type with the as prop.
If DisplayText is used as a heading, set the as to the appropriate heading level, given the context where it is used.
Feel at home with Qasa
Sizes
The size prop can be used to change the size of the DisplayText.
2x Extra small
Extra small
Small
Medium
Large
Large
API Reference
| Prop | Default | Description |
|---|---|---|
as? | - | "h2" |
size? | 'md' | ResponsiveProp<"sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "xs" | "2xs">Sets the visual size of the display text.
To override the rendered tag, use the |
textAlign? | 'left' | DisplayTextAlignSets the text alignment |
textWrap? | 'pretty' | DisplayTextWrapSets the text wrapping See MDN Docs |