BLACK FRIDAY
Ends in 00h 00m 00s
25% OFF LTD

Ready to enhance your Breakdance experience?

Add premium elements that enhance user experience.

Quick Started

Ready to enhance your Bricks Builder experience?

Unlock Breakfusion. Make today your launch day.

Dotted Image Configurator - Breakfusion
data-dotted-image

Dotted Image

Interactive Dotted Image Effect for Breakdance Builder

How to Use & Code Information
â–¼
  1. Customize your dotted image effect using the controls below
  2. Enter an image URL in the Image URL field
  3. Click Copy JS to copy the JavaScript code to clipboard
  4. In Breakdance Builder, add a Code element
  5. Paste the JavaScript code
  6. To add the effect to any section: go to Section → Settings → Advanced → Attributes, add data-dotted-image with value true
Image Source
Image URL ℹ

Provide an image URL for the dotted effect. The image will be sampled and rendered as individual dots.

Object Fit ℹ
Dot Settings
Cell Size ℹ
4
Dot Scale ℹ
0.9
Shape ℹ
Color Settings
Background Color ℹ
Grayscale ℹ
Tint Color ℹ
Tint Strength ℹ
0
Dropout Strength ℹ
0.1
Sample Average ℹ
Interaction Settings
Interactive ℹ
Distortion Mode ℹ
Distortion Strength ℹ
3
Distortion Radius ℹ
80
Follow Speed ℹ
0.2
Animation Settings
Jitter Strength ℹ
4
Jitter Speed ℹ
1
Fade On Leave ℹ
Fade Speed ℹ
0.1
Max FPS ℹ
60