# Image Price Grid

> Show pricing in a grid with a hero image for each price item.

URL: https://sectionstar.app/sections/image-price-grid/
Source: Section Star — https://sectionstar.app
Updated: 2026-10-26T00:00:21.889Z

---

**Image Price Grid** is a Shopify theme section in the Section Star library. Show pricing in a grid with a hero image for each price item.

## About the Image Price Grid section

The Image Price Grid section is a feature that allows Shopify store owners to create a visually appealing grid layout showcasing different pricing plans or product options. Each grid item can include an image, title, description, price, list of features, and a call-to-action (CTA) button. This makes it easy for customers to compare different offerings and take action on their interests.

## Live demo

## Use cases

1. **Subscription Plans**: E-commerce stores offering subscription services can use this section to display various subscription plans with different features and pricing tiers.
2. **Product Comparisons**: Stores selling products in different variations (e.g., sizes, qualities, bundles) can use this layout to showcase the differences and prices in a side-by-side format.
3. **Service Packages**: Businesses offering services (e.g., consulting, marketing) can highlight different packages with distinct features, helping clients choose the one that fits their needs.
4. **Special Promotions**: Highlight limited-time offers and special deals in an organized and attractive manner to capture the customers' attention quickly.

## Settings

Every setting below appears in the Shopify theme customizer once the section is published.

### Grid Design
Set settings for the grid

| Setting | Type | Default |
| --- | --- | --- |
| Gap Between Testimonials | Number | 20 |

### Column Design
Set settings for the price columns

| Setting | Type | Default |
| --- | --- | --- |
| Background Color | Color or gradient | linear-gradient(319deg, rgba(255, 255… |
| Round Borders | Range | 5 |
| Subtle Shadow | Checkbox | On |
| Highlight Color | Color | #111 |

### Image Design
Set the display for the image

| Setting | Type | Default |
| --- | --- | --- |
| Image Aspect Ratio | Select (21:9, 16:9, 4:3, 1:1, auto) | 16 / 9 |
| Image Width (size requested from Shopify) | Number | 600 |
| Mobile Image Aspect Ratio | Select (21:9, 16:9, 4:3, 1:1, auto) | 16 / 9 |
| Mobile Image Width (size requested from Shopify) | Number | 800 |

### Button Design
Set the display for the button

| Setting | Type | Default |
| --- | --- | --- |
| Button Background Color | Color or gradient | linear-gradient(164deg, #111 0%, #333… |
| Button Text Color | Color | #fff |
| Button Background Color | Color or gradient | linear-gradient(164deg, #10D01A 0%, #… |
| Button Text Color | Color | #fff |

### Headline
Set text for the headline

| Setting | Type | Default |
| --- | --- | --- |
| Text Alignment | Text alignment | center |
| Mobile Text Alignment | Text alignment | center |
| Headline | Inline rich text | <b>Sample Headline</b> |
| Text | Inline rich text | Use this block to add a description. … |
| Spacing between Headline and Features | Number | 15 |

### Price Item block settings

| Setting | Type | Default |
| --- | --- | --- |
| Highlighted | Checkbox | On |
| Image | Image | — |
| Title | Inline rich text | <b>Standard</b> |
| Description | Inline rich text | Perfect for Getting Started |
| Price | Inline rich text | $25 / mo |

#### Features
Features for the plan. Leave blank to skip.

| Setting | Type | Default |
| --- | --- | --- |
| Bullet 1 | Text | Bullet Feature 1 |
| Bullet 2 | Text | Bullet Feature 2 |
| Bullet 3 | Text | Bullet Feature 3 |
| Bullet 4 | Text | Bullet Feature 4 |
| Bullet 5 | Text | Bullet Feature 5 |
| Bullet 6 | Text | Bullet Feature 6 |
| Bullet 7 | Text | — |
| Featue 8 | Text | — |

#### Button
Link and title for the button

| Setting | Type | Default |
| --- | --- | --- |
| Call to Action Link | URL | — |
| Button Title | Text | Get Started |