Search blocks by description or jump to a page.
A card that expands to reveal extra detail when clicked, keeping the summary visible. Use it on dashboards to tuck away long notes inside a tidy tile.
Card Collapsible is a single bordered card with a clickable header row. The header shows a label on the left and a chevron icon on the right. Clicking the header toggles the panel open or closed: the chevron swaps direction and a body section slides in beneath a dividing line, showing a short paragraph of detail text.
The label, body copy, and the number of cards on the page are all yours to change. The toggle behavior is self-contained, so you can drop in any text without adjusting the layout. If you need more than one expandable section, the sibling blocks in this group handle stacked or grouped arrangements.
Reach for this block when a single item needs a summary that readers can expand on demand. On an online education platform it works well for a course card that shows the title up front and lets learners reveal the syllabus, prerequisites, or instructor notes without leaving the page. It is a better fit than a full accordion when there is only one section to expand, because the card framing gives it visual weight a plain disclosure row would lack.
A natural flow around it on a Components page:
Before
After
The block has one collapsible card with a header trigger and a hidden body. A few ways to put it to work:
Tip: keep the body text to two or three sentences so the expanded card stays compact and does not push sibling content far down the page.