---
title: "ExplodingText3D — Free Framer component · Best of Framer"
description: "Free Framer component · by Olamide Badusi · Text. Key Features 3-Axis Cinematic Motion: Control the \"shatter\" across X, Y, and Z axes."
canonical: "https://framer.elliotli.dev/component/explodingtext3d"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/ExplodingText3D

# ExplodingText3D

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

![ExplodingText3D preview image 1](https://framer.elliotli.dev/og/component/explodingtext3d/ff424549715bb67e/1600x1200.jpg)

## Summary

Key Features 3-Axis Cinematic Motion: Control the "shatter" across X, Y, and Z axes.

## Description

### Key Features

-   **3-Axis Cinematic Motion:** Control the "shatter" across X, Y, and Z axes. Make text fly towards the viewer or dissolve into a radial cloud.
    
-   **Physics-Based Spring Smoothing:** No jerky movements. The "Smoothness" control uses spring dynamics to ensure the explosion feels organic and premium.
    
-   **Three Explosion Modes:**
    
    -   **Radial:** Characters fly outwards from the center.
        
    -   **Upwards:** A gravity-defying lift-off effect.
        
    -   **Forward:** Deep immersion as text flies past the camera.
        
-   **Built-in Depth of Field:** Integrated scroll-synced blur simulates a real camera lens focusing as characters drift away.
    
-   **Sticky-Scroll Engine:** The text stays pinned to the viewport while the animation plays out over a customizable scroll distance.
    
-   **Total Typographic Control:** Full Google Font integration, letter-spacing, and "Word vs. Letter" splitting mode
    

### 🎯 Who Is This For?

-   **Creative Agencies:** Perfect for "Our Impact" or "Vision" sections where you need to leave a lasting impression.
    
-   **Portfolio Sites:** Showcase your "Creative Spark" with an interactive hero element.
    
-   **SaaS & Tech Landing Pages:** Ideal for visualizing abstract concepts like "Breaking Barriers" or "Cloud Scale."
    

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

-   All · #7010

## Details

- **Author**: Olamide Badusi
- **Published**: 2026-01-14
- **Updated**: 2026-01-12
- **Added**: 2025-12-29
- **Categories**: Text

## More like this

-   [Text Reveal Effect](/component/text-reveal-effect) — Lera · $4 — Text reveal effect over "ghost" layer.
-   [Soft Heading](/component/soft-heading) — Kaisa A · Free — Animated Soft Heading in 2 colors
-   [Curved Text Marquee](/component/curved-text-marquee) — Ahmet Loca · Free — Animated Bend
-   [Type Write Effect](/component/type-write-effect) — Russet Supply · Free — Animated Text & Interactive Typing
