# Card Group

<div align="left"><figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2FwpX6Db6oqr8wTooafBFc%2Fimage.png?alt=media&#x26;token=74523d11-433e-4354-94e1-b93057655398" alt="" width="67"><figcaption><p>Card Group</p></figcaption></figure></div>

The **`Card Group`** is a pre-built responsive element that is designed to show a group of related [Card](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/card) elements.

The element is composed of 1 [Layout Container](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/layout-container) element with:

* 1 [Layout Row](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/layout-row) configured to show a 3 column layout for larger screens and a single column layout for smaller screens (via its [Column Layout Format](https://docs.zingy.ai/app-editor/page-editor/layout-row#column-layout-format) setting).
* 3 [Layout Column](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/layout-column) elements inside the Layout Row.

To add cards into the group, simple drag and drop the [Card Style1](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/card-style1), [Card Style2](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/card-style2) and [Card Style2](https://docs.zingy.ai/app-editor/page-editor/built-in-elements/card-style3) elements into the Layout Column elements.&#x20;

<figure><img src="https://3401585094-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FmnBepgycwgisXr9ya1N4%2Fuploads%2F4DS1WzguvnmeDmFXLXDU%2Fimage.png?alt=media&#x26;token=71fb6de6-81bb-4709-b7c8-5f1a4a96c75e" alt=""><figcaption><p>Example Card Group with <a href="card-style1">Card Style1</a>, <a href="card-style2">Card Style2</a> and <a href="card-style3">Card Style3</a> elements.</p></figcaption></figure>

If you need more cards:

* [Clone](https://docs.zingy.ai/app-editor/working-with-page-elements#clone-the-selected-element) one of the Layout Columns
* Add the additional card into the cloned column

You can customize the card group's layout by modifying the [Column Layout Format](https://docs.zingy.ai/app-editor/page-editor/layout-row#column-layout-format) setting for the layout row.