---
title: "Setting the image size for products in the cart and checkout"
description: "Serve larger images instead of the default compressed ones if you want to dispaly them larger"
url: https://help.cartgenie.com/en/articles/216-setting-the-image-size-for-products-in-the-cart-and-checkout
collection: "Store Pages FAQ"
updated: 2026-08-05
language: en
---

# Setting the image size for products in the cart and checkout

Serve larger images instead of the default compressed ones if you want to dispaly them larger

By default, CartGenie compresses variant images and serves them to customers when they are added to the cart or displayed at checkout. This helps reduce page load times due to large image sizes and dimensions.

For most users, this is ideal as the cart and checkout images don’t need to be very large. However, if your page layout requires larger display sizes, the images can appear pixelated.

Here is how to fix that:

In **Webflow**, go to the page where you want to change the image size served: **Cart or Checkout Page**

Click on the CartGenie wrapper for the page:

-   **Cart:**
    
    -   Layer Name (default): “cg-cart-wrapper”
        
    -   It should have the custom attribute: **data-cg-cart-modal="1"**
        
-   **Checkout:**
    
    -   Layer Name (default): “cg-section”
        
    -   It should have the custom attribute: **data-cg-page="checkout"**
        

Then, in the Layer **Settings** panel add a new **Custom Attribute**

![](https://staticfiles.gleap.io/gattachments/uQWOH8C8fhurutTKC49p8U5ZJJA9zT6EpVAt2A7GuT1ZmDddzLtevI1sFn7EyETsEj0Ef0V7QsS.png)

**Name**:

```javascript
data-cg-cart-item-img-size
```

**Value**:

```javascript
large
```

**Size options to use as values:**

-   large
    
    -   max size: 3000x3000
        
-   medium
    
    -   max size: 500x500
        
    -   _(This is the default size used without adding a custom attribute)_
        
-   small
    
    -   max size: 256x256
        
-   thumb
    
    -   max-size: 64x64
        

**Note**: Each product image is only served once per page. So if the cart and checkout wrappers have separate sizes, then the cart image will be displayed correctly on all pages except the checkout where it will get overwritten by the defined checkout value size.