<CardGroup cols={2}>
  <Card title="First Card">
    Neque porro quisquam est qui dolorem ipsum quia dolor sit amet
  </Card>
  <Card title="Second Card">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit
  </Card>
</CardGroup>

The CardGroup component lets you group multiple Card components together. It’s most often used to put multiple cards in a grid, by specifying the number of grid columns.

First Card

Neque porro quisquam est qui dolorem ipsum quia dolor sit amet

Second Card

Lorem ipsum dolor sit amet, consectetur adipiscing elit

<CardGroup cols={2}>
  <Card title="First Card">
    Neque porro quisquam est qui dolorem ipsum quia dolor sit amet
  </Card>
  <Card title="Second Card">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit
  </Card>
</CardGroup>

Props

cols
default:2

The number of columns per row