---
title: "Image Split Reveal — Framer component · Best of Framer"
description: "$9.00 · Framer component · by Aidan Looker · Effects. What is Image Split Reveal?"
canonical: "https://framer.elliotli.dev/component/image-split-reveal"
---

[Home](/)/[Components](/components)/[Effects](/components/category/effects)/Image Split Reveal

# Image Split Reveal

Split-reveal hover effect for images

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

![Image Split Reveal preview image 1](https://framer.elliotli.dev/og/component/image-split-reveal/6f2008855efcfb9a/1600x1200.jpg)

## Summary

What is Image Split Reveal?

## Description

## What is Image Split Reveal?

Image Split Reveal is a premium hover interaction component that creates a dramatic split effect on images. On hover, the image separates into two halves revealing customizable text content with smooth animations. Ideal for portfolios, landing pages, product showcases, hero sections, and any design that needs a memorable first impression.

[![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-8vjwbcr2-RQLDut7AgLOovQEwgaJNpNG4n3n3B6)](https://teampixelau.lemonsqueezy.com/checkout/buy/3b016e8d-2ba4-4944-8431-e2c592334df1)

## Core Features

-   Four split animation styles: Horizontal, Vertical, Diagonal, and Curved
    
-   Animated line divider between headline and subtitle
    
-   Customizable text with separate font controls
    
-   Optional CTA button with slide-fill hover animation
    
-   Gradient overlay
    
-   Custom cursor option for enhanced interactivity
    
-   Fully responsive
    

## Controls inside Framer

### Image

-   Responsive image picker
    

### Headline

-   Text content
    
-   Font size
    
-   Font family
    

### Subtitle

-   Text content
    
-   Font size
    
-   Font family
    

### Animation

-   Split style (Horizontal, Vertical, Diagonal, Curved)
    
-   Split distance
    
-   Text animation (Fade, Slide, Scale, Blur)
    

### Text Style

-   Text color
    
-   Show backdrop toggle
    
-   Backdrop color
    

### Button

-   Show button toggle
    
-   Button text
    
-   Link
    
-   Button color
    
-   Text color
    
-   Font family
    

### Effects

-   Gradient overlay toggle
    
-   Gradient color
    
-   Gradient opacity
    

### Custom Cursor

-   Enable toggle
    
-   Cursor color
    
-   Cursor size
    

## Best use cases

-   Portfolio hero sections with dramatic image reveals
    
-   Product showcases with hover-to-explore interactions
    
-   Landing page feature highlights
    
-   Gallery and case study presentations
    
-   Agency and creative studio websites
    

Elevate your Framer projects with premium hover interactions that captivate visitors and create lasting impressions.

## Questions or custom requests?

-   We design and build custom Framer components. Get in touch at [contact@teampixel.com.au](mailto:contact@teampixel.com.au).
    

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

-   All · #11034

## Details

- **Author**: Aidan Looker
- **Price**: $9.00
- **Published**: 2026-02-15
- **Updated**: 2026-06-13
- **Added**: 2026-02-08
- **Categories**: Effects

## More like this

-   [Liquid Glass Loupe](/component/liquid-glass-loupe) — Aisol Studio · $12 — Liquid glass lens over content
-   [Sticky Scenes](/component/sticky-scenes) — Sofía Martín · $5 — Scroll-driven stories with sticky
-   [Studio ASCII Reveal](/component/studio-ascii-reveal) — Tanmay Kaper · $12 — Your portrait, redrawn in ASCII
-   [Kinetic Sprout](/component/kinetic-sprout) — Buster Studios · $19 — A headline that grows