# Feature Grid

> Showcase your products in a flexible grid to drive sales. Choose stacked or slideshow for mobile display.

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

---

**Feature Grid** is a Shopify theme section in the Section Star library. Showcase your products in a flexible grid to drive sales. Choose stacked or slideshow for mobile display.

## About the Feature Grid section

The Feature Grid section is a versatile and visually appealing section designed to highlight key features or products on your Shopify store. It allows you to showcase multiple items in a grid layout with customizable images, headlines, and call-to-action buttons. Perfect for drawing attention to new arrivals, bestsellers, or special promotions, the Feature Grid section adapts to various screen sizes for optimal viewing on both desktop and mobile devices.

## Live demo

## Use cases

1. **Highlighting New Arrivals**: Showcase the newest additions to your store with high-quality images, compelling headlines, and direct links to product pages.
2. **Promoting Bestsellers**: Draw attention to your best-selling products to potential customers, enhancing their visibility and potentially boosting sales.
3. **Seasonal Collections**: Feature seasonal or themed collections with eye-catching visuals and a cohesive layout, ideal for holiday promotions or limited-time offers.
4. **Customer Testimonials**: Use the grid layout to present customer reviews or testimonials with images, ensuring they stand out and add credibility to your store.
5. **Special Promotions**: Announce time-sensitive deals or discounts with prominent headlines and call-to-action buttons, encouraging immediate customer action.

## Settings

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

### Feature Design
Set settings for the feature blocks

| Setting | Type | Default |
| --- | --- | --- |
| Text Color | Color | #fff |
| Text Size | Range | 20 |
| Mobile Text Size | Range | 20 |
| Show Text Shadow | Checkbox | On |

### Grid Design
Set settings for the grid

| Setting | Type | Default |
| --- | --- | --- |
| Grid Gap | Number | 20 |
| Cover Background | Color or gradient | linear-gradient(164deg, #111 0%, #555… |
| Cover Opacity | Range | 25 |
| Media Aspect Ratio | Select (21:9, 16:9, 4:3, 1:1, 9:16, Auto) | 4 / 3 |
| Media Aspect Ratio (mobile) | Select (21:9, 16:9, 4:3, 1:1, 9:16, Auto) | 4 / 3 |
| Round Borders on Media | Range | 5 |
| Subtle Shadow on Media | Checkbox | On |

### Mobile Display
Set the mobile display

| Setting | Type | Default |
| --- | --- | --- |
| Mobile Display | Select (Slideshow, Stacked) | slideshow |
| Columns (when stacked) | Select (1 column, 2 columns, 3 columns) | 1fr |
| Slideshow Progress Background Color | Color or gradient | linear-gradient(177deg, rgba(17, 17, … |
| Slideshow Progress Foreground Color | Color or gradient | linear-gradient(177deg, rgba(17, 17, … |
| Slideshow Indicator Color | Color | #111 |
| Enable Autoplay? | Checkbox | On |
| Autoplay Time | Select (Slowest (10s), Slower (7.5s), Normal (5s), Faster (3s), Fastest (2s)) | 5000 |

### Button Style
Set the look and feel of the button

| Setting | Type | Default |
| --- | --- | --- |
| Padding Top/Bottom | Number | 10 |
| Padding Left/Right | Number | 25 |
| Round Borders on Button | Range | 5 |
| Border Size | Number | 0 |
| Border Color | Color | #111 |
| Button Background Color | Color or gradient | linear-gradient(164deg, #111 0%, #333… |
| Button Text Color | Color | #fff |
| Secondary Button Background Color | Color or gradient | linear-gradient(164deg, #111 0%, #333… |
| Secondary 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>Check out our Products</b> |
| Text | Inline rich text | Shop our extensive range of amazing p… |
| Spacing between Headline and Features | Number | 15 |

### Feature block settings

| Setting | Type | Default |
| --- | --- | --- |
| Background Image | Image | — |
| Headline | Inline rich text | Feature Headline |
| Call to Action | Inline rich text | Shop Now |
| Call to Action Link | URL | — |
| Make Entire Block Clickable | Checkbox | Off |

#### Secondary Button (optional)
Do not use with the make entire block clickable

| Setting | Type | Default |
| --- | --- | --- |
| Show Secondary Action? | Checkbox | Off |
| Call to Action | Inline rich text | Secondary Action |
| Call to Action Link | URL | — |