Center, Square, and Circle are components that center its children within itself.

Hello World!

rc.center(
    rc.text("Hello World!"),
    border_radius="15px",
    border_width="thick",
    width="50%",
)

Below are examples of circle and square.

Square

Circle

rc.hstack(
    rc.square(
        rc.vstack(rc.text("Square")),
        border_width="thick",
        border_color="purple",
        padding="1em",
    ),
    rc.circle(
        rc.vstack(rc.text("Circle")),
        border_width="thick",
        border_color="orange",
        padding="1em",
    ),
    spacing="2em",
)

rc.Center

A box that centers its contents.

Props

No component specific props

Event Triggers

See the full list of default event triggers

rc.Circle

A square container with round border-radius.

Props

No component specific props

rc.Square

A centered square container.

Props

No component specific props