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

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

​
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.
​
group
Typography settings for the text.
​
boolean
When enabled, the text is italicized.
​
boolean
When enabled, the text is underlined.
​
option
How the text is aligned in the text field. Options are Left, Center, or Right.
​
group
Color settings for the text.

​
Advanced properties

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