Library
/
Chakra
/
Media
/
Image
The Image component can display an image given a src
path as an argument.
This could either be a local path from the assets folder or an external link.
rx.chakra.image(
src="/reflex_banner.png", width="100px", height="auto"
)
Image composes a box and can be styled simlarly.
rx.chakra.image(
src="/reflex_banner.png",
width="100px",
height="auto",
border_radius="15px 50px",
border="5px solid #555",
box_shadow="lg",
)
You can also pass a PIL
image object as the src
.
from PIL import Image import requests class ImageState(rx.State): url = f"https://picsum.photos/id/1/200/300" image = Image.open(requests.get(url, stream=True).raw) def image_pil_example(): return rx.chakra.vstack( rx.chakra.image(src=ImageState.image) )
Did you find this useful?