# Image cards: Flex carousel

![image](https://docs-assets.foxecom.app/pebble-theme/Fox-BG%20Light%20-%202025-11-24T172608.541_Q8QSvYKC.jpg)

Showcase products, collections, or image-based storytelling using a flexible, swipe-ready carousel layout.

## How to add an Image cards: Flex carousel section to your Shopify store

<Hint type="success">

1. In the theme editor **(Customize)**, click **Add section.**
2. Select **Image cards: Flex carousel** section.
3. Make necessary changes.
4. **Save.**

</Hint>

## How to edit the section Image cards: Flex carousel

### Section settings

#### **Carousel settings**

<Table widths="275,auto">

| Setting | Description |
| --- | --- |
| **Overflow content** | Control whether items slightly peek outside the container (`visible`) or use edge shadows (`edge-shadows`). |
| **Slides per view** | Choose `auto` (free-size cards) or fixed `columns`. |
| **Columns** | Number of desktop columns (2–4). Visible only if using fixed columns. |
| **Column gap** | Horizontal space between cards on desktop. |

</Table>

<Tabs>
<Tab title="Visible">

![image](https://docs-assets.foxecom.app/pebble-theme/image_ajuEHZqh.png)

</Tab>

<Tab title="Edge shadows">

![image](https://docs-assets.foxecom.app/pebble-theme/image_CMF3ISp4.png)

</Tab>
</Tabs>

#### **Carousel controls**

<Table widths="275,auto">

| Setting | Description |
| --- | --- |
| **Control type** | Choose navigation style: none, standard arrows, or floating arrows. |

</Table>

<Tabs>
<Tab title="Standard">

![image](https://docs-assets.foxecom.app/pebble-theme/image_Vmiwt7Tg.png)

</Tab>

<Tab title="Float">

![image](https://docs-assets.foxecom.app/pebble-theme/image_3A3HK7q3.png)

</Tab>
</Tabs>

### Block settings

Beside the static **Header** block. The carousel supports 3 block types:

* [Image card](https://docs.foxecom.com/pebble-theme/theme-blocks/basic#image-card)
* [Collection card](https://docs.foxecom.com/pebble-theme/theme-blocks/collection#collection-card)
* Collection item (custom card)

<Expandable title="See Collection item block settings">

Display a compact, clickable collection pill with an image and title.

![image](https://docs-assets.foxecom.app/pebble-theme/image_kbUkiYm4.png)

<Table widths="275,auto">

| Setting | Description |
| --- | --- |
| **Collection** | Select a collection to link to. If set, the entire block becomes a clickable link. |
| **Image** | Upload a custom image. If left blank, Pebble auto-pulls: collection image → first product image. |
| **Aspect ratio** | Controls image shape. |
| **Collection title** | Optional custom title. If blank, the collection’s real name is used. |

</Table>

</Expandable>