With a rich text box, you can apply styles to parts of your text or use Markdown syntax.
It's a great option for long-form content or FAQs where you want to emphasize specific portions of the text.
Rich text boxes are also used to display the body content created in Studio CMS within the editor.
Adding a rich text box
In the navigation menu on the left side of the Design Editor, select the [Add] icon
.Select [RichText] from [Basic].
Once clicked, a rich text box will be placed on the screen.
Markdown syntax
You can use Markdown syntax in rich text boxes.
For details on the available Markdown syntax, check out the following help article.
Styling rich text
You can edit the design of text within a rich text box, including colors and fonts.
These settings are configured in the [Content] tab of the right panel.
Opening the rich text design settings
Select the rich text box.
Click the [Content] tab in the right panel.
If the panel is closed, open the right panel first.
Setting colors for rich text
Use the color palette to set colors.
For details on how to configure these settings, see Setting colors with the color palette.
Things to know when using gradients
You can also apply gradient styles to text.
Text with a gradient applied will show the color transition across the entire block.
Settings that can't be combined with text gradients
The following settings aren't available on text boxes with a gradient applied:
Text box background color
Underline
Also, if a gradient is applied to a list (<ul>, <ol>), the list markers (bullets or numbers) will be hidden.
Animation and browser compatibility
By adding a transition (duration, delay, easing) to a gradient, you can create smooth color changes.
This effect uses the CSS @property rule, which isn't supported in some browsers.
For details on browser support, see "@property" | Can I use... Support tables.
Note on conditional styles
When using a conditional style to transition from "solid color → gradient," the text may briefly appear to disappear.
This is by design and is currently difficult to avoid, so please consider the state changes and visual effects before using it.
Other things to keep in mind
Gradient settings are applied to the entire text block at once.
Be sure to check the live preview or published site to confirm there are no display issues, such as hidden list markers when applied to lists.
Font settings
You can set fonts just like with a regular text box. For details on font settings, see the following help articles.
Applying special styles to parts of your text
You can apply special styles like "bold, italic, strikethrough, underline, and links" to specific parts of your text. The parts with these special styles applied can be selected individually, and their design can be edited from the [Content] tab.
