✨ Announcing our seed funding led by Lux Capital! Read more about it on our blog
DocsBlogChangelog

Search documentation...

/

Star

12k+

[ Learn ]

[ Concepts ]

[ Reference ]

Card


Card is a flexible component used to group and display content in a clear and concise format.

Header

Body of the Card Component

rx.card(
    rx.text("Body of the Card Component"),
    header=rx.heading("Header", size="lg"),
    footer=rx.heading("Footer", size="sm"),
)
You can pass a header with header= and/or a footer with footer=

Card


The parent wrapper that provides context for its children.


  • Base Event Triggers

CardHeader


The wrapper that contains a card's header.


  • No props for CardHeader.

  • Base Event Triggers

CardBody


The wrapper that houses the card's main content.


  • No props for CardBody.

  • Base Event Triggers

CardFooter


The footer that houses the card actions.


  • No props for CardFooter.

  • Base Event Triggers

← ResponsiveGridSpacer →

Copyright © 2023 Pynecone, Inc.