OudsDisplayText
Display styles are intended for high-impact content such as landing pages, marketing campaigns, and key messages. Their large type sizes help capture attention and establish strong visual emphasis. Variants automatically adapt across breakpoints to maintain a consistent visual hierarchy on every screen size. Use them sparingly to preserve their impact and effectiveness.
An overload accepting annotated types is available for rich text formatting.
Design
| Name | Display |
| Version | 1.0.0 |
Parameters
Text to be displayed.
Modifier applied to the display text.
Size of the display text.
Color of the display text.
Alignment of the text within the lines of the paragraph. See TextStyle.textAlign.
Line height for the Paragraph in TextUnit unit, e.g. SP or EM. See TextStyle.lineHeight.
How visual overflow should be handled.
Callback that is executed when a new text layout is calculated. A TextLayoutResult object that callback provides contains paragraph information, size of the text, baselines and other details. The callback can be used to add additional decoration or functionality to the text. For example, to draw selection around the text.
Samples
OudsDisplayText(
modifier = Modifier.padding(OudsTheme.spaces.fixed.small),
text = "Display",
size = OudsDisplayTextSize.Medium
)Display styles are intended for high-impact content such as landing pages, marketing campaigns, and key messages. Their large type sizes help capture attention and establish strong visual emphasis. Variants automatically adapt across breakpoints to maintain a consistent visual hierarchy on every screen size. Use them sparingly to preserve their impact and effectiveness.
An overload accepting plain text is available for simple text without formatting.
Design
| Name | Display |
| Version | 1.0.0 |
Parameters
OudsAnnotatedDisplayText to be displayed.
Modifier applied to the display text.
Size of the display text.
Color of the display text.
Alignment of the text within the lines of the paragraph. See TextStyle.textAlign.
Line height for the Paragraph in TextUnit unit, e.g. SP or EM. See TextStyle.lineHeight.
How visual overflow should be handled.
Callback that is executed when a new text layout is calculated. A TextLayoutResult object that callback provides contains paragraph information, size of the text, baselines and other details. The callback can be used to add additional decoration or functionality to the text. For example, to draw selection around the text.
Samples
val highlightColor = OudsTheme.colorScheme.content.brandPrimary
OudsDisplayText(
modifier = Modifier.padding(OudsTheme.spaces.fixed.small),
text = buildOudsAnnotatedDisplayText {
append("Label with ")
withColor(color = highlightColor) { append("highlighted text") }
},
size = OudsDisplayTextSize.Small
)