# Circle Scroll

> Display a circle menu in a beautiful, easy-to-scroll grid. Add items manually or add a collection.

URL: https://sectionstar.app/sections/circle-scroll/
Source: Section Star — https://sectionstar.app
Updated: 2026-10-26T00:00:21.885Z

---

**Circle Scroll** is a Shopify theme section in the Section Star library. Display a circle menu in a beautiful, easy-to-scroll grid. Add items manually or add a collection.

## Live demo

## Settings

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

### Grid Design
Set the design for the feature grid

| Setting | Type | Default |
| --- | --- | --- |
| Show Scrollbars | Checkbox | Off |
| Gap | Number | 20 |

### Circle Design
Set the design of the card

| Setting | Type | Default |
| --- | --- | --- |
| Subtle Shadow on Circle | Checkbox | On |
| Round Borders on Circle | Range | 50 |
| Show Ring on Circle | Checkbox | On |
| Border on Circle | Checkbox | On |
| Border Color | Color | #fff |
| Circle Size | Number | 200 |
| Arrow Background Color | Color or gradient | linear-gradient(164deg, #fff 0%, #fff… |
| Arrow Color | Color | #111 |

### Testimonial Design
Set the look and feel of the testimonial

| Setting | Type | Default |
| --- | --- | --- |
| Stars Color | Color | #111 |

### 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 |
| Button Background Color | Color or gradient | linear-gradient(164deg, #111 0%, #333… |
| Button Text Color | Color | #fff |

### Media Display
Set the display of the media

| Setting | Type | Default |
| --- | --- | --- |
| Show Big Play Button | Checkbox | On |

### 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 |

### Image block settings

| Setting | Type | Default |
| --- | --- | --- |
| Ring Color | Color or gradient | linear-gradient(310deg, rgba(17, 189,… |
| Image | Image | — |
| Image Size | Number | 800 |
| Mobile Image Size | Number | 800 |
| Optional Text | Inline rich text | Menu Text |
| Optional Link | URL | — |

### Video block settings

| Setting | Type | Default |
| --- | --- | --- |
| Hero Video | Video | — |
| Optional Text | Inline rich text | Menu Text |
| Optional Link | URL | — |
| Play Inline | Checkbox | On |
| Autoplay | Checkbox | Off |
| Loop Video | Checkbox | Off |
| Show Video Controls | Checkbox | Off |
| Mute Video | Checkbox | Off |

### Collection block settings

| Setting | Type | Default |
| --- | --- | --- |
| Ring Color 1 | Color or gradient | linear-gradient(310deg, rgba(17, 189,… |
| Ring Color 2 | Color or gradient | linear-gradient(310deg, rgba(17, 189,… |
| Ring Color 3 | Color or gradient | linear-gradient(310deg, rgba(17, 189,… |
| Collection | Collection | — |