Skip to main content
The Text component of UI Studio lets you create formatted text that displays on your UI Studio pages. Use text components to add headings, paragraphs, instructions, labels, or any textual content. The text in the component can be configured to display in various formats such as italic, underline, specific text alignment, and custom styling.

​
Basic usage

Add a text component to your UI Studio page to display content.
Basic Text component
Enter your text content and apply formatting to create visually appealing, readable content.

​
Best practices

  • Format similar items consistently. For example, if you bold important terms in one text component, use the same format for all important terms.
  • Limit the number of fonts and font sizes on a specific UI Studio page. Use a font type that reflects your organization’s design. For font size, select one for all headings, another for body text, and another for footnotes and other small text.
  • Avoid using multiple emphasis styles on the same text. For example, choose just bold, but do not underline or italicize the same text as well.

​
Configuration properties

​
Basic properties

​
Text
string
The text content to display. Supports rich text formatting when Font options are applied. Text line length is 50-75 characters for optimal readability, but use 35-50 characters for mobile devices.
​
Font
group
Typography settings for the text.
​
Italic
boolean
When enabled, the text is italicized.
​
Underline
boolean
When enabled, the text is underlined.
​
Text Alignment
option
How the text is aligned in the text field. Options are Left, Center, or Right.
​
Colors
group
Color settings for the text.

​
Advanced properties

​
Padding Top
integer
The amount of whitespace at the top of the text field in pixels.
​
Padding Left
integer
The amount of whitespace on the left edge of the text field in pixels.