---
title: "FeatureCarousel — Framer component · Best of Framer"
description: "$12.00 · Framer component · by Hamim Reza · Carousels. Feature chips carousel with image cards"
canonical: "https://framer.elliotli.dev/component/featurecarousel"
---

[Home](/)/[Components](/components)/[Carousels](/components/category/carousels)/FeatureCarousel

# FeatureCarousel

Feature chips carousel with image cards

[View on Framer](https://framer.com/marketplace/components/featurecarousel/?via=elliot-li)

![FeatureCarousel preview image 1](https://framer.elliotli.dev/og/component/featurecarousel/4f64a7337b99e89e/1600x1200.jpg)

## Summary

Feature chips carousel with image cards

## Description

An interactive carousel with clickable feature chips on one side and matching image cards on the other. Auto-play cycles through features automatically and pauses on hover. Spring physics animations, live badge indicator, and gradient overlays. Built for SaaS product pages, landing pages, and feature showcase sections that need an engaging interactive presentation.

## Features

-   Clickable feature chips navigate to matching image card instantly
    
-   Auto-play cycles through features with configurable interval (1000–10000ms)
    
-   Pauses auto-play on hover
    
-   Spring physics animations on chip and card transitions
    
-   Horizontal layout — chips left, cards right
    
-   Vertical layout — chips top, cards bottom
    
-   Animated live badge with custom text
    
-   Optional gradient overlay masks on chip panel top and bottom
    
-   8 built-in icon types per chip — leaf, users, globe, check, cloud, phone, dashboard, wand
    
-   Full color controls — chip panel, active chip, inactive chip, image border, card background
    
-   Full typography controls — chip font, card tag, description and live badge fonts
    
-   Configurable chip and card border radius
    
-   Configurable image border width
    
-   Auto-play disabled in Framer canvas for easy editing
    
-   No dependencies
    

## Property Controls

**Content**

-   Features — array of feature objects · id, label, icon, image, description per item (3–10 recommended)
    

**Layout**

-   Layout Direction — horizontal or vertical
    
-   Item Height — chip height (40–120px)
    
-   Auto Play Interval — time between advances (1000–10000ms)
    

**Colors**

-   Left Panel Color · Active Chip Background · Active Chip Text Color
    
-   Inactive Chip Text Color · Inactive Chip Border Color
    
-   Gradient Color · Right Panel Background · Image Border Color
    

**Typography**

-   Chip Font · Card Tag Font · Card Description Font · Live Badge Font
    

**Appearance**

-   Chip Border Radius (4–100px) · Card Border Radius (0–64px)
    
-   Image Border Width (0–20px) · Show Gradient Overlay toggle
    
-   Live Badge Text — custom badge label
    

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-noe48s4g-iDDdZgMPrTWC23KC3RltLHVmXj8YSP)

## Use Cases

SaaS product pages · Feature highlight sections · Landing pages · App showcase sections · Product comparison layouts · Onboarding flows · Service presentations · Startup homepages

**SEO Keywords**

framer feature carousel · framer chip navigation · framer feature tabs · framer product features · framer interactive carousel · framer saas component · framer feature showcase · framer tab carousel · framer feature slider · framer landing page component · framer animated carousel · framer product carousel · framer feature section · framer code component · framer spring animation

## Rank history [How rankings work →](/terms#rankings)

-   All · #6477

## Details

- **Author**: Hamim Reza
- **Price**: $12.00
- **Published**: 2026-04-10
- **Updated**: 2026-04-17
- **Added**: 2026-03-29
- **Categories**: Carousels

## More like this

-   [3DCurvedImageMarquee](/component/3dcurvedimagemarquee) — Lera · $4 — Curved perspective double ticker
-   [Orbit Kit Carousel](/component/orbit-kit-carousel) — Khairul Fauzy Khairudin · $12 — 3D drag carousel with inertia
-   [Team Orbit](/component/team-orbit) — Ali Musa · Free — Interactive Team Showcase
-   [Glow Testimonial](/component/glow-testimonial) — Interface Studio · Free — Testimonials with a Little Glow