Skip to main content
Div and Span are unstyled primitives — the escape hatches for when Row, Column, and Grid don’t express what you need. Both support css_class for Tailwind and style for arbitrary inline CSS.

​
Div

A block container with no default styling. Style it through css_class or style: For CSS that Tailwind can’t express — vendor prefixes, clamp(), mask-image, etc. — use the style prop:

​
Span

An inline text element with no default styling. Useful for inline annotations or colored text:

​
API Reference

Div Parameters

​
css_class
str | None
default:"None"
Tailwind CSS classes. Div has no built-in styling.
​
style
dict[str, str] | None
default:"None"
Inline CSS styles for properties that Tailwind can’t express.

Span Parameters

​
content
str
required
Text content. Can be passed as a positional argument.
​
css_class
str | None
default:"None"
Tailwind CSS classes. Span has no built-in styling.
​
style
dict[str, str] | None
default:"None"
Inline CSS styles for properties that Tailwind can’t express.

​
Protocol Reference

Div
{
  "type": "Div",
  "id?": "string",
  "onMount?": "any",
  "children?": "[Component]",
  "let?": "object",
  "style?": "object",
  "cssClass?": "string"
}
Span
{
  "type": "Span",
  "id?": "string",
  "onMount?": "any",
  "content": "string (required)",
  "bold?": "boolean",
  "italic?": "boolean",
  "underline?": "boolean",
  "strikethrough?": "boolean",
  "uppercase?": "boolean",
  "lowercase?": "boolean",
  "code?": false,
  "align?": "null",
  "style?": "object",
  "cssClass?": "string"
}
For the complete protocol schema, see Div, Span.