Saltar al contenido principal
LIVE

Visual Configurator

Now active with 50+ animations

Get Started
NEW

Library

Visual configurator

SureCart

Resources

Templates
Get StartedLogin
Main categories

Hero

21 components

Cards

18 components

Pricing

17 components

Header

5 components

Features

27 components

Testimonial

12 components

CTA

11 components

Button

10 components

About

7 components

Contact

9 components

Megamenu

7 components

Roadmap

5 components

Ready to enhance your Bricks Builder experience?

Access our complete library of professional components.

Explore allHow it worksGet Started
Animated elements

Core Background

Dynamic background animations

Showcase

Impressive presentation effects

Visual effects

Eye-catching elements

Animated texts

Dynamic typography effects

Interactions

User-triggered animations

Menu animation

Interactive Menu Effects

Soon

Transition pages

Smooth navigations effects

Soon

Instant Motion

Instant animations, preconfigured for stunning visual impact

Ready to enhance your Bricks Builder experience?

Add premium elements that enhance user experience.

How it worksGet Started
SureCart components

Product pages

High quality product templates

SureSwitch

Dynamic price toggle with flexible payment options

SureProtect

Elegant content protection for premium membership areas

Ready to enhance your Bricks Builder experience?

Take advantage of these extraordinary features to enrich your customers' websites.

Explore allGet Started

Pricing

Simple, transparent pricing plans

Limited LTD

About me

Learn about Bricksfusion

ChangeLog

Latest updates and improvements

Roadmap

Find out what's coming to Bricksfusion

Contact

Get in touch with us

Community

Join our facebook community

Quick Started

Discover how easy Bricksfusion is

Download Core Framework Stylesheet

Makes templates look exactly as designed

Ready to enhance your Bricks Builder experience?

Unlock Bricksfusion. Make today your launch day.

Get Started
  • Library

    • Library

    • Explore Full Library

      Access our complete collection of professional components.

      View All Components

    • Hero

      20 components

      Cards

      18 components

      Pricing

      17 components

      Header

      5 components

      Features

      25 components

      Testimonial

      12 components

      CTA

      11 components

      Button

      10 components

      About

      7 components

      Contact

      9 components

      Megamenu

      7 components

      Roadmap

      5 components

  • Visual configurator

    • Visual Configurator

    • Animated elements

      Enhace your projects with professional motion effects.

      Get Premium Access

    • Animated Elemnets

      Core Background

      Dynamic background animations

      ShowCase

      Impressive presentation effects

      Visual effects

      Eye-catching elements

      Animated texts

      Dynamic typography effects

      Interactions

      User-triggered animations

      Menu animation

      Interactive Menu Effects

      Soon

      Transition pages

      Smooth navigations effects

      Soon

      Instant Motion

      Instant animations, preconfigured for stunning visual impact

  • SureCart

    • SureCart

    • SureCart components

      Product pages

      High quality product templates

      SureSwitch

      Dynamic price toggle with flexible payment options

      SureProtect

      Elegant content protection for premium membership areas

    • Templates
  • Resources

    • Resources

    • Pricing

      Simple, transparent pricing plans

      Limited LTD

      About me

      Learn about Bricksfusion

      Contact

      Get in touch with us

      ChangeLog

      Latest updates and improvements

      Roadmap

      Find out what's coming to Bricksfusion

      Quick Started

      Discover how easy Bricksfusion is!

      Community

      Join our facebook community

    • Get StartedLogin

    Documentation

    v2.0

    GETTING STARTED
    Quick started
    Installing transitions
    MENU ANIMATIONS
    Expandable tab

    New

    Mobile Opener

    New

    Dynamic island
    CORE BACKGROUND
    Ambient Gradient
    Aura Flow
    Celestial Flow
    Cosmic Harmony
    Fire effect
    Floating Glow
    Fluids
    Vortex
    Nebula
    Network effectSnowfall
    Video Overlay
    New!
    Wave Background
    New!
    Path

    New

    SHOWCASE
    AutoSlide
    Avatar
    Brand Carousel
    Card Expand
    Card Twist
    Card Tilted
    Carousel Cards
    Dimension Reel
    Fade Flow
    Scroll Gallery

    New

    Scroll Stack
    Talent Orbit
    Wave Card
    VISUAL EFFECTS
    Blossom

    New

    Border Drift
    Border Stream
    Button Reveal
    Circles
    Curtain Reveal
    Ethereal Trail
    Flip Canvas
    Gemini

    New

    Glass Card
    PrismBorder
    Spotlight
    Status Pulse
    SVG Reveal
    Whisper motion

    New

    ANIMATED TEXT
    Morphing text

    New

    Proximity

    New

    Reveal text
    Text Motion
    Text Wave
    Video text

    New

    Word Rotate
    INTERACTION
    Copy&Paste
    Float vision

    New

    Folder
    Horizontal Parallax
    Smart Notify
    Social Bloom
    Timeline GradientVertical Parallax
    INSTANT MOTION
    Ray Cast
    Water
    Gradient
    Orbe
    Huly
    Warp
    SURECART
    Installing templatesSureCart 001 Product PageSureCart 002 Product PageSureCart 003 Product PageSureCart 004 Product Page
    BUTTONS
    Hover fill
    Ripple effect
    Wave effect
    Magnetic effect
    Hover 3D
    Shine effect
    Portal effect
    Essence effect
    Aura effect
    Brush effect
    TRANSITION PAGES
    Transition Page 1

    Soon

    Transition Page 2

    Soon

    Transition Page 3

    Soon

    Transition Page 4

    Soon

    Transition Page 5

    Soon

    Transition Page 6

    Soon

    Transition Page 7

    Soon

    Premium element

    Core Background

    Video Overlay

    Video Overlay provides a dynamic, full-screen video that plays behind content within a container. It allows for smooth transitions between an initial preview video and the main looping video.

    Preview

    Open preview

    Drip of Time

    Contemporary Art

    Quick Setup

    data-video-background=true

    Required

    Applied to the container to enable the video background functionality.

    data-video-src

    Required

    Specifies the source URL of the video file that will be played in the background.

    data-video-control=toggle

    Optional

    Applied to an element inside the container to allow users to toggle between play and pause for the main video.

    data-pause-icon

    Optional

    A class that changes the appearance of the toggle element to a "pause" icon when the video is playing.

    Key features

    • Muted Playback: The videos (preview and main) are muted.
    • Customizable Button: You can customize the play/pause button using the data-pause-icon attribute to change its appearance.
    • Responsive Handling: The video resizes and adjusts its position to fit the container, ensuring optimal display without stretching or distortion.

    We're here to help

    Choose how you'd like to connect with our support team

    Contact Support

    Get help from our team of experts

    Response within 24 hours

    Fluid Path Animation Configurator

    How to Use in Bricks Builder

    1. Customize your fluid path animation 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-path-animation📋
      to any container element
    This tool creates a custom script with your settings built-in. You only need to add the data attribute to implement your fluid path animation effect!
    BricksFusion Exclusive Get Your Fluid Path Animation

    Add an elegant flowing path animation to your website with this custom-crafted JavaScript snippet.

    • Easy implementation with simple data attributes
    • Fully responsive and mobile-friendly
    • Customizable colors and animation speed
    • Accessibility toggle option for reduced motion
    Path Settings
    Number of Paths 24
    Path Color
    Choose 'currentColor' to inherit from text color by selecting white
    Path Base Opacity 0.1
    Path Width 0.5
    Animation Speed 0.5
    Z-Index 0
    Blend Mode
    For dark backgrounds, "screen" generally offers better visibility

    JavaScript Code