Text Widget

The text widget is the foundation for instructions and feedback. Use it to explain the task, label a section, present a prompt, or show follow-up guidance.

Adding a title or a paragraph? The Heading, Subheading, and Body tiles beside Text in the widget library drop this same widget already sized for that job — see Text Presets. Everything below applies to those too.

How text boxes size themselves

A text box isn't a fixed rectangle — it's your text, and the box fits itself around it:

• New text boxes hug their content. Add one and start typing: the box widens as you type, and when it reaches the edge of the scene the text wraps to the next line and the box grows downward. You never have to resize it to make room.
• Drag a corner to change the text size. Corner handles scale the whole piece of text — the font gets bigger or smaller with the box, and a small badge shows the size while you drag. (You can always set an exact size with the Font Size slider.)
• Drag a side handle to choose where text wraps. The side pills make the box narrower or wider _without_ changing the font size — the text simply reflows, and the box's height adjusts to fit the lines.
• The height takes care of itself. It always fits the text, so there's no height setting to manage.

The Width control in the panel shows which mode a box is in: Auto width (hugging its content) or Fixed width (wrapping at a width you chose). Dragging a side handle switches a box to Fixed; switching back to Auto re-fits the box to its text. The Width number field (under advanced layout) is the keyboard way to set an exact wrap width.

Editing the copy

• Double-click a text widget to edit it in place — a new text box opens ready to type over.
• Enter starts a new line. Click anywhere outside the box (or press Esc) to finish; your edit is kept, and Undo reverses it if you change your mind.
• Deleting all the text and clicking away removes the widget.
• You can also edit in the Text field in the Properties panel.

Settings to know

• Text is the copy learners see.
• Typography lets you pick a font, weight, italic, and color. Most widgets share these controls; the Text widget also supports motion and styling effects. See Typography and Fonts.
• Line Spacing sets the gap between lines, as a multiple of the font size (1.00× is tight, 1.50× is comfortable for reading). The box's height follows it.
• New text is centered by default; use the Alignment buttons for left or right. Alignment also decides which way an auto-width box grows as you type, and it keeps applying when you add a visual or entrance effect.
• Visual effects add steady-state styling like aurora gradients, sparkles, line shadows, or text-on-a-circle. See the typography guide for the full catalog.
• Entrance effects start when the text first appears — when the scene opens, or when a hidden text box is revealed — and include typewriter, scramble, slide-in, reveal-on-view, and string morphing. Most play through once; Morph between keeps cycling. See the typography guide for the full catalog.
• Using Liquid variables like {{ score }}? They work in the text and in Typing and Morph between strings. The canvas shows the braces as you typed them; learners see the filled-in value. The box is sized around the template text you typed, and the filled-in value can be a little longer or shorter for each learner — leave some breathing room around personalized text.

Grading setup

Text widgets are not graded. They support the learning task by giving context before, during, or after interaction.

How to set up the content

Keep directions short and direct. Put the action first: "Sort these events in order" is stronger than "Below you will see a list of events that should be sorted."

Useful setting combinations

• large font + bold format:

Best for scene titles and section headings.

• background color behind text:

The color fills the box, which hugs the text. For a bigger colored panel behind a direction, place a shape widget behind the text — that gives you full control of the panel's size and padding.

• hidden by default + button reveal:

Best for hints, feedback, and answer explanations.

• Liquid variable text:

Best for personalized feedback such as Nice work, you scored {{ score }}.

Strong use cases

• A scene title or objective at the top of the page.
• A short prompt above a question widget.
• Feedback that appears only after submission.

Great pairings with other widgets

• Pair text with multiple choice to frame the question clearly.
• Pair text with flashcard to add study instructions like "Say the answer before flipping."
• Pair text with button to reveal extra coaching only when needed.
• Pair text with timer to turn a direction into a challenge prompt.
• Pair text with shape to build a padded callout panel: the shape is the banner, the text sits on top.