Skip to main content
Every text component accepts a content string as a positional argument and supports {{ field }} interpolation. Styles adapt automatically to dark mode.

Text Components

Prefab has a text component for every level of the visual hierarchy. They all share the same API: positional content, formatting kwargs (bold, italic, underline, etc.), and css_class for anything else.

Inline Formatting

Modifiers

All text components accept formatting kwargs that compile to Tailwind classes: bold, italic, underline, strikethrough, uppercase, lowercase, and align. Span is the inline formatting primitive. It carries all the same modifiers as Text, plus code for monospace styling and style for inline CSS. Link works the same way but renders as an anchor tag with href. Pass mixed strings, Spans, and Links to Text as positional arguments. Strings auto-wrap as plain spans:

API Reference

Common Parameters

All text components share this interface:
str
required
Text content. Accepts {{ field }} interpolation. Can be passed as a positional argument.
bool | None
default:"None"
Bold weight.
bool | None
default:"None"
Italic style.
bool | None
default:"None"
Underline decoration.
bool | None
default:"None"
Strikethrough decoration.
bool | None
default:"None"
Transform text to uppercase.
bool | None
default:"None"
Transform text to lowercase.
"left" | "center" | "right" | "justify" | None
default:"None"
Horizontal text alignment.
str | None
default:"None"
Additional Tailwind CSS classes.

Text

Accepts mixed positional args for inline formatting:

Heading

int
default:"1"
Heading level: 1 (h1), 2 (h2), 3 (h3), or 4 (h4).

Span

bool
default:"False"
Render as inline code with monospace font and background.
dict[str, str] | None
default:"None"
Inline CSS styles as a dict of property/value pairs.

Link

str
required
URL to navigate to.
str | None
default:"'_blank'"
Link target: _blank (new tab) or _self (same tab).
bool
default:"False"
Render as inline code link.
dict[str, str] | None
default:"None"
Inline CSS styles.

Protocol Reference

Text
Heading
For the complete protocol schema, see Text, Heading, Span, Markdown.