Skip to content

component

Burn Hover Reveal

By Saadat Ali

Details

Summary

Cinematic liquid & burn hover

Description

Features Real-time WebGL hover reveal effects 3 built-in cinematic styles: Liquid Wipe Paper Burn Smooth mouse-reactive parallax motion Organic fluid distortion with noise simulation Realistic ember and burn edge visuals High-performance shader rendering Fully responsive image scaling Zero image bleeding during transitions Optimized for Framer editor and live sites Ultra-smooth cinematic easing animations Customization Options Upload custom top and bottom images Switch between 3 effect styles Control animation speed Adjust liquid refraction intensity Customize ripple strength and flow speed Change wipe direction angles Fine-tune paper burn texture and ember width Modify hover parallax depth Toggle editor preview mode Customize burn hole size and reveal behavior How to Use Add the component to your Framer canvas Upload your primary and secondary images Choose an effect style: Liquid Wipe Paper Burn Adjust animation and distortion settings Customize parallax depth for cinematic movement Preview interactions directly in Framer Publish your site with GPU-accelerated hover effects Use Cases Creative portfolio hover galleries Fashion and editorial websites Premium product showcases Interactive hero sections Agency case study reveals Experimental landing pages Luxury brand interactions WebGL-powered image transitions

Introduction

Cinematic liquid & burn hover

Rank history

Daily rank per list, from the first snapshot — lower is better.

12515017518458/148/228/309/79/15
  • All · #845