The Image class is designed to create and handle image elements to be sent and displayed in the chatbot user interface.

You must provide either an url or a path or content bytes.

Attributes

name
str

The name of the image to be displayed in the UI.

display
ElementDisplay

Determines how the image element should be displayed in the UI. Choices are “side” (default), “inline”, or “page”.

size
ElementSize

Determines the size of the image. Only works with display=“inline”. Choices are “small”, “medium” (default), or “large”.

url
str

The remote URL of the image source.

path
str

The local file path of the image.

content
bytes

The file content of the image in bytes format.

Usage with message scope

Code Example
import chainlit as cl

# Sending an image with the local file path
elements = [
  cl.Image(name="image1", display="inline", path="./image1.jpg")
]

await cl.Message(content="Look at this local image!", elements=elements).send()

Usage without scope

Code Example
import chainlit as cl
import aiofiles

# Sending an image with the local file path
image1 = cl.Image(name="image1", display="inline", path="./image1.jpg")
await image1.send()

# Sending an image with file content as bytes
async with aiofiles.open("./image2.jpg", "rb") as f:
    image_content = await f.read()
    image2 = cl.Image(name="image2", display="inline", content=image_content)
    await image2.send()