LIVE NOW

Visual Configurator is now active — Customize 50+ professional animations Visual Configurator is live!

Get Started
Text Reveal Configurator

How to Use in Bricks Builder

  1. Customize your text reveal effect using the controls below
  2. Click the Get Code button and copy the JavaScript
  3. In Bricks Builder, add a Code element and paste the JavaScript
  4. Add the attribute
    data-text-reveal-section📋
    to any section element
This tool creates a custom script with your settings built-in. You only need to add the data attribute to implement your text reveal effect!

Discover the power of smooth text reveal animations.
Create engaging and interactive reading experiences.
Capture your audience's attention with style.

BricksFusion Exclusive Get Your Text Reveal Effect

Add an elegant text reveal animation to your website that captures attention and enhances the reading experience.

  • Easy implementation with simple data attributes
  • Word-by-word reveal animation on scroll
  • Fully responsive and mobile-friendly
  • Customizable animation speed and styling
Animation Settings
Animation Speed 0.3x

Controls animation sensitivity to scroll (lower = faster reveal with less scroll)

Trigger Position 50%

Position in viewport where animation triggers (0 = top, 100 = bottom)

Animation Length 100%

Distance over which animation occurs (% of viewport height)

Appearance
Initial Color

Starting color that transitions to the initial color

Reveal Color

Color that will be revealed when scrolling

Text Opacity 20%

Opacity of animation transition (lower values create more contrast)

Reveal Animation Type
Each line of text appears as a single unit
Each word animates individually in sequence
Each letter animates individually for a typewriter effect
Advanced Settings
Scroll Smoothness 0.5s

How smooth the animation responds to scrolling (higher values = smoother but slower response)

Element Selection

Choose which elements should have the reveal effect