Elements & Extensions
Magnifying Dock
Turn section backgrounds or the whole page into an Interactive WebGL Fluid Simulation. The extension abstracts something pretty complicated into a very easy-to-use and versatile package that will make any design stand out.
WebGL Fluid
Go beyond the usual entrance animations. Not only are the animations unique and easy to use, but they also allow for more variations and control than what you’ve come to expect from entrance animations in a page builder.
Entrance Animations
A text link element that provides a micro-interaction switching between two given texts on hover using a morphing/blending effect compatible with the Breakdance Menu Builder.
Gooey Menu Link
A slideshow extension that uses WebGL to transition between images using jaw-dropping creative effects. It includes several transition effects, direction settings, and more for a variety of look and feel.
WebGL Slideshow
Create our own custom kinetic 3D backgrounds using this unique WebGL extension. With different geometric shapes, the ability to use any custom image and a plethora of shader effects, it packs a whole lot of powers into a small set of settings for an unlimited amount of variations.
WebGL Kinetic Typography
An Interactive WebGL Element that allows you to swap 2 images, 2 videos, or a combination of both using an image-based distortion effect on hover. It comes with several displacement effects, the ability to use custom images for the displacement effect, and more.
WebGL Media Hover Distortion
A button element that centers its position to the current mouse location on hover and glues itself to the mouse cursor for a given distance on mouse move that’s compatible with the Breakdance Menu Builder. The glue effect is enabled by default so you don’t have to do any configuration and can just use it as you would normally use the standard button element.
Glue Menu Button
Create paths between elements in your sections, animate a pulse along the path. The extension can used to craft modern SaaS Integrations Sections, bespoke interactions, backgrounds and more.
Pulse Paths
Turn your background into a wavy piece of art with this unique WebGL extension. The extension comes with several pre-defined styles and the ability to add as many colors as you need, making sure no two implementations will be alike.
WebGL Wavy Gradients
The #1 Interactions implementation for Breakdance. It allows you to apply actions based on triggers initiated by the user, browser events, or events dispatched by elements and extensions from Breakdance and Elements Hive. A small package that provides you with endless possibilities.
Interactions
A text link element that provides a micro-interaction switching between two given texts on hover using a morphing/blending effect.
Gooey Link
Part of the Mouse Effects extensions family, the Mouse Track extension for Breakdance allows you to enable mouse follow functionality on any element on your page with a single toggle. With a few settings, you can control how the element will be affected on all its 3D axis.
Mouse Track
A background extension that allows you to change the mouse cursor into an interactive ink-like entity that can be applied to a section or the whole page. With several visual styles and effects, it’s the perfect addition to add that finishing touch to your designs.
Ink Cursor
An Interactive UI Pattern for links that displays a hover-over preview of an Image or Video using smooth animations compatible with the Breakdance Menu Builder. It includes several animation styles, auto-positioning for the revealed element depending on the current scroll position so that it is always visible, movement effects, and more.
Link Media Reveal Menu
Enhance your storytelling capabilities by turning stroke-based SVG files into interactive design elements that can be dynamically drawn. Different triggers, drawing modes, and helper options make it the perfect companion for your SVGs.
SVG Path Drawer
A Container Element that randomly positions its child elements within the constraints that you define, helping you create generative design.
Scatter Container
Turn any element on your page into a draggable element with a single toggle. The extension has several advanced features that allow you to easily create different effect patterns.
Draggable
A container element that allows you to reveal hidden content via several stylish overlay transitions. It has a lot of use cases and UI patterns like Quickview, fullscreen menus, side panels on pages, and any post types.
Gooey Overlay
Create interactive image backgrounds that can be distorted using several different styles during mouse/touch movement. Since the distortion works with images, it can be used creatively with all kinds of images.
WebGL Liquid Distortion
An advanced accordion element that includes several pre-defined buttery smooth animations. Being a container element, you can add any elements you need under each Content Accordion Item giving you total freedom over the design and use cases.
Content Accordion
A versatile container element that allows you to switch between two panels using several transition styles. Each panel can contain any other elements giving you the freedom to craft whatever designs you imagine. It can be used to create advanced Flip Boxes, Sliding Boxes, and more.
Content Reveal Container
Part of the Mouse Effects extensions family, the Images Trail extension allows you to create an animated trail of images on your sections or your whole page that follow the current cursor position.
Images Trail
Easily alter the background color of a page as you scroll by designating transition points in your pages. You can also optionally and selectively change the text color of elements of your choosing.
On Scroll Color Switcher
An Interactive UI Pattern for links that displays a hover-over preview of an Image or Video using smooth animations. It includes several animation styles, auto-positioning for the revealed element depending on the current scroll position so that it is always visible, movement effects, and more.
Link Media Reveal
A fresh take on a common design element. The Elements Hive Image Comparison element uniquely conveys the element’s functionality using fluid micro-animations instead of additional interface elements making for an elegant minimalist design.
Image Comparison
An incredibly versatile custom cursor extension that allows you to turn mouse movement into a living entity. You can configure the cursor to change styles, scale, or show any SVG ( even animated ones ) when the cursor enters any element of your choosing.
Morphing Cursor
Turn your mouse cursor into a magnet that can wrap links, buttons, or any element you choose on hover. It works automatically with all Breakdance links, you can also include additional custom elements to the mix using CSS selectors, customize the inner and outer portions separately, and ignore or hide the cursor selectively on different elements.
Magnetic Cursor
A slideshow element that uses WebGL to transition between images using jaw-dropping creative effects. It includes several transition effects, direction settings, and more for a variety of look and feel.
WebGL Slideshow
A global extension that helps you make scrolling through your website feel smoother and takes away the choppy feeling that you may experience with certain scroll-based animations.
Smooth Scroll
Part of the Mouse Effects extensions family, the Tilt 3D extension for Breakdance allows you to add dynamic rotation on any element on your page with a single toggle. When enabled, the element will keep updating its angle to match the current direction of the mouse.
Tilt 3D
A button element that centers its position to the current mouse location on hover and glues itself to the mouse cursor for a given distance on mouse move. The glue effect is enabled by default so you don’t have to do any configuration and can just use it as you would normally use the standard button element.
Glue Button
Get the power to easily implement powerful and unique WebGL-based image carousels. The element contains several velocity-sensitive silky smooth WebGL scroll and distortion effects all while allowing you to work in a familiar HTML-based carousel workflow.
WebGL Image Carousel
Part of the Mouse Effects extensions family, the Spotlight extension for Breakdance allows you to easily enable a spotlight effect on any element. Interactive spotlight and glow effects are just toggle away.
Spotlight
Unique Scrolling Animations in an easy-to-use format. The animations include a variety of settings, and the implementation comes with some powerful features like Scroll Direction, so you can choose which direction(s) the animation gets applied, the ability to pin elements of your choosing during the animation, and more.
Scroll Animation
A container element that applies a mask to the nested content. The mask can be animated when an element enters the viewport or on page scroll giving you an additional simple yet powerful design element to bring your designs to life.
Morph Masker
Get the power to create unique and avant-garde slider designs with the WebGL Lone Slider. With the ability to separately position all the elements and a number of creative WebGL-based transitions, it is a versatile slider container element like no other.
WebGL Lone Slider
Create unique, modern, and interactive 3D Metaballs backgrounds using this WebGL extension. It comes with a number of shapes and shading modes and settings so you can create a variety of designs easily.