Carousel Controls

Update 1.2

• Fix the scrollable stack control

• Optimize the code

• Add Slide Distance which works for stack whom overflow set to on scroll it let you customize the how much distance it will travel on each click

Update 1.1

• Add Layout Properties

• Add Hover controls

• Add Border Properties

Overview

Carousel Controls provides previous and next navigation for your image or content carousels. It works seamlessly with any stack-based carousel and Framer Carousel Component and gives you control over button styling, direction, and layout spacing.

How to Set Up

1. Add the CarouselControls component to your canvas.

2. In the Select Carousel field, enter the exact layer name of the carousel or stack you want to control — for example, carousel.

   💡 This field links the controls to your carousel. Make sure the name matches exactly.

3. Choose the Direction — horizontal (↔) or vertical (↕).

4. Adjust Button Size and Spacing to your preference.

5. Style it with your own arrow color, background color, and border radius.

6. Optionally, show labels or replace default arrows with custom icons.

Features

• Works with any Framer carousel or stack.

• Smooth, minimal design that adapts to your layout.

• Full control over size, spacing, and direction.

• Supports custom icons and color styling.

• Quick setup — just connect and go.