Skip to main content
A wrapper around HTML text that can be used as an output. Output an Html object as the last expression of a cell to render it in your app.

Usage

hello_world = mo.Html("<h2>Hello, World</h2>")
mo.Html(
    f'''
    <h1>Hello, Universe!</h1>
    {hello_world}
    '''
)

Signature

mo.Html(text: str)

Parameters

text
str
required
A string of HTML.

Attributes

text
str
A string of HTML representing this element.

Methods

batch

Convert an HTML object with templated text into a UI element. This method lets you create custom UI elements that are represented by arbitrary HTML.
user_info = mo.md(
    '''
    - What's your name?: {name}
    - When were you born?: {birthday}
    '''
).batch(name=mo.ui.text(), birthday=mo.ui.date())
In this example, user_info is a UI Element whose output is markdown and whose value is a dict with keys 'name' and 'birthday' (and values equal to the values of their corresponding elements). Parameters:
  • **elements: the UI elements to interpolate into the HTML template.

center

Center an item.
mo.md("# Hello, world").center()
Returns: An Html object. Right-justify.
mo.md("# Hello, world").right()
Returns: An Html object.

left

Left-justify.
mo.md("# Hello, world").left()
Returns: An Html object.

callout

Create a callout containing this HTML element. A callout wraps your HTML element in a raised box, emphasizing its importance. You can style the callout for different situations with the kind argument.
mo.md("Hooray, you did it!").callout(kind="success")
mo.md("It's dangerous to go alone!").callout(kind="warn")
Parameters:
  • kind (Literal[“neutral”, “danger”, “warn”, “success”, “info”]): The kind of callout. Defaults to “neutral”.
Returns: An Html object.

style

Wrap an object in a styled container.
mo.md("...").style({"max-height": "300px", "overflow": "auto"})
mo.md("...").style(max_height="300px", overflow="auto")
Parameters:
  • style (Optional[dict[str, Any]]): An optional dict of CSS styles, keyed by property name.
  • **kwargs: CSS styles as keyword arguments.
Returns: An Html object.

Build docs developers (and LLMs) love