---
title: "RGB Warp Carousel — Framer component · Best of Framer"
description: "$10.00 · Framer component · by Himanshu S. · Carousels. WebGL image slider/carousel featuring stunning chromatic RGB split effects, dynamic distortion, and buttery-smooth drag interactions."
canonical: "https://framer.elliotli.dev/component/rgb-warp-carousel"
---

[Home](/)/[Components](/components)/[Carousels](/components/category/carousels)/RGB Warp Carousel

# RGB Warp Carousel

Curved image carousel with RGB spl

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

## Summary

WebGL image slider/carousel featuring stunning chromatic RGB split effects, dynamic distortion, and buttery-smooth drag interactions.

## Description

Preview URL - [https://diverse-area-940302.framer.app/](https://diverse-area-940302.framer.app/)

A premium WebGL image slider/carousel featuring stunning chromatic RGB split effects, dynamic distortion, and buttery-smooth drag interactions. Showcase your portfolio with style. Includes clickable titles, greyscale mode, and full customization. Optimized for all devices.

## How to Use This Component

### Quick Start Guide:

1.  **Add to Canvas**
    

-   Drag the component onto your Framer canvas
    

-   Component automatically adjusts to your layout width
    

1.  **Upload Your Images**
    

-   Click on "Images" in the property panel
    

-   Add/remove image items as needed
    

-   Upload images using the Image picker
    

-   Add titles and optional links for each image
    

1.  **Customize Effects**
    

-   Adjust "Distortion" slider for skew intensity (0-10)
    

-   Control "RGB Split" for chromatic aberration effect (0-5)
    

-   Toggle "Image Greyscale" for black & white mode
    

1.  **Configure Interactions**
    

-   Set "Friction" to control slide momentum (0.8-0.99)
    

-   Adjust "Max Vel" for drag speed limits
    

-   Enable "Image Link" to make titles clickable
    

1.  **Style Your Slider**
    

-   Set "Width" for individual image size (100-800px)
    

-   Adjust "Gap" between images (0-200px)
    

-   Customize "Title Font", "Title Color", and "Transform"
    

-   Change "Background" color as needed
    

1.  **Test & Publish**
    

-   Drag horizontally to test the slider
    

-   Preview on different devices (mobile-optimized)
    

-   Publish your site - effects work in live preview!
    

## 🎨 Perfect For:

-   Portfolio websites
    

-   Agency showcases
    

-   Photography galleries
    

-   Product presentations
    

-   Creative studios
    

-   Design showcases
    

-   Case study displays
    

## After your purchase, you will receive a link to the Component URL.

Copy URL and paste it to your Framer Project.

## Need help?

For any setup issues or questions, feel free to contact for support.

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

-   All · #9026

## Details

- **Author**: Himanshu S.
- **Price**: $10.00
- **Published**: 2025-12-01
- **Updated**: 2026-10-23
- **Added**: 2025-11-25
- **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
