---
title: "Glass Shatter Reveal — Free Framer component · Best of Framer"
description: "Free Framer component · by Mx. Bear · Interactive. Screenshots, details, and remix links on Best of Framer."
canonical: "https://framer.elliotli.dev/component/glass-shatter-reveal"
---

[Home](/)/[Components](/components)/[Interactive](/components/category/interactive)/Glass Shatter Reveal

# Glass Shatter Reveal

Mx. Bear

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

![Glass Shatter Reveal preview image 1](https://framer.elliotli.dev/og/component/glass-shatter-reveal/d1e32a35990c555c/1600x1200.jpg)

## Summary

Mx. Bear

## Description

### **About this Component**

Drop in your image and let your visitors smash the glass!

This interactive component hides your content behind a frosted pane. With each click of the hammer cursor, dynamic cracks spread from the exact point of impact, culminating in a satisfying final shatter that completely unveils your image.

### **Component Properties**

**• Image:** Automatically scales and maps to perfectly cover the frame with zero distortion.

**• Hits to Break:** Control the suspense. Set the exact number of strikes required to completely shatter the glass. (Default: 3, Max: 9)

### **Use Cases**

• Tactile First Impressions: Transform plain thumbnails into interactive "break-to-reveal" moments that instantly hook your visitors.

• Dramatic Teasers: The ultimate choice for product drops, event landing pages, portfolio covers, or anywhere you need a powerful, unforgettable reveal.

### **How to Install**

To install the component, please copy and paste the component URL directly onto your Framer canvas.

### **Important Note**

Please note that the animations only work in Preview mode. The component may appear paused or as an empty screen on the Framer canvas.

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

-   All · #4514

## Details

- **Author**: Mx. Bear
- **Published**: 2026-07-14
- **Updated**: 2026-09-22
- **Added**: 2026-07-14
- **Categories**: Interactive

## More like this

-   [Velvet Curtain](/component/velvet-curtain) — Sarthak Prakash · $12 — Cinematic curtain reveal effect
-   [Image-Compare Slider](/component/image-compare-slider) — Studio Digital · Free — Reveal what changed, beautifully
-   [Lesson Packages](/component/lesson-packages) — Shelfless Studio · $9 — Lesson bundles with savings shown
-   [Deskbell AI Chatbot](/component/deskbell-ai-chatbot) — NS. Studio · Free — AI site chat, works with Chatbase