Circles - breakfusion.com

Customize your circles animation using the controls below
Click the Get Code button and copy the JavaScript
In Breakdance Builder, add a Code element and paste the JavaScript
Add the attribute
data-circles-animation📋
with the value "true" to any container element

This tool creates a custom script with your settings built-in. All your circles animation configurations are included in the generated code! Remember to set the attribute value to "true" for the effect to work properly.

Breakfusion Exclusive Get Your Circles Animation Effect

Add dynamic animated floating circles to your website with this custom-crafted JavaScript snippet.

Easy implementation with simple data attributes
Fully responsive design that adapts to any container
Customizable circle colors and properties
Performance optimized for smooth animations
Works in all modern browsers and devices

Animation Settings

Number of Circles 12

Number of Circles (Mobile) 3

Minimum Size 150px

Maximum Size 400px

Animation Speed 2

Responsive Mode

Blend Mode

Color Settings

Color Scheme

Documentation

GETTING STARTED

MENU ANIMATION

CORE BACKGROUND

SHOWCASE

VISUAL EFFECTS

ANIMATED TEXT

INTERACTION

INSTANT MOTION

TRANSITION PAGES

How to Use in Breakdance Builder

JavaScript Code