---
title: "Before & After Case — Framer component · Best of Framer"
description: "$5.00 · Framer component · by Agung M · Carousels. Before/After Deliverables"
canonical: "https://framer.elliotli.dev/component/before-after-case"
---

[Home](/)/[Components](/components)/[Carousels](/components/category/carousels)/Before & After Case

# Before & After Case

Portfolio Before & After

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

![Before & After Case preview image 1](https://framer.elliotli.dev/og/component/before-after-case/e3dcd625e0597235/1600x984.jpg)

## Summary

Before/After Deliverables

## Description

Built for agencies, studios, and freelance designers who need a fast way to present "before/after" case studies without custom code.

-   Drag-to-reveal comparison slider between any two images
    
-   One-click switch between a desktop browser frame and a mobile device frame
    
-   Fully themeable, background, ink, and accent colors are all property controls
    
-   Editable title, meta line, and before/after labels for every project
    
-   Works as a single instance per case study, drop one in for each project in your portfolio
    

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

-   All · #4697

## Details

- **Author**: Agung M
- **Price**: $5.00
- **Published**: 2026-09-16
- **Updated**: 2026-09-27
- **Added**: 2026-09-16
- **Categories**: Carousels

## More like this

-   [Screen Stage Mockup](/component/screen-stage-mockup) — Aisol Studio · $14 — Your screens in synced devices
-   [Team Reel](/component/team-reel) — Ali Musa · Free — Interactive Team Showcase
-   [Slider](/component/slider) — MAS · Free — A smooth, customizable slider.
-   [Cascade Card Slider](/component/cascade-card-slider) — Tim Yeng · Free — Cards that cascade into view