Basic Carousel

Basic Carousel

About Basic Carousel

Introduction

A basic carousel component for Framer sites that need reliable, adjustable slides without extra complexity. Set slide count, spacing, autoplay, arrows, dots, image behavior, links, and text styles from the right panel.

Details

Basic Carousel is a simple carousel component for Framer creators who want a reliable slide UI without building everything from scratch.

Use it for:

  • Product cards

  • Blog or article cards

  • Portfolio highlights

  • Testimonials

  • Image galleries

  • Feature sections

You can customize:

  • Slides per view

  • Gap and padding

  • Infinite loop

  • Autoplay

  • Pause on hover or drag

  • Arrows and dots

  • Link behavior

  • Typography

  • Image ratio, fit, position, loading, fade, and skeleton

  • Card radius, border, background, and shadow

Accessibility

Supports prefers-reduced-motion by stopping autoplay and reducing carousel motion for visitors who prefer less movement.

Support Notes

If autoplay does not run, check the visitor's reduced motion setting.

---

Introduction

余計な複雑さを避けた、Framer 向けの基本カルーセルです。スライド数、余白、自動再生、矢印、ドット、画像、リンク、文字スタイルを右パネルから調整できます。

Details

Basic Carousel は、Framer で使いやすい基本カルーセルをすばやく作るための Code Component です。

向いている用途:

  • 商品カード

  • ブログや記事カード

  • ポートフォリオ

  • お客様の声

  • 画像ギャラリー

  • 特徴紹介

調整できること:

  • 表示するスライド数

  • 余白

  • 無限ループ

  • 自動再生

  • hover / drag 時の一時停止

  • 矢印とドット

  • リンクの挙動

  • 文字スタイル

  • 画像比率、表示方法、位置、読み込み、fade、skeleton

  • カードの角丸、線、背景、影

Accessibility

OS の「動きを減らす」設定に合わせて、自動再生を止め、カルーセルの動きを弱めます。

Support Notes

自動再生が動かない場合は、閲覧者の OS で「動きを減らす」設定がオンになっていないか確認してください。