Cool Mode

How to use the coolmode effect for applying a cool particle effect

Overview

The coolmode effect allows you to add a cool particle effect to your DOM elements when using the ClickFusion component.

Usage

To enable Cool Mode, set the effect property to “coolmode” in your ClickFusion component.

<ClickFusion effect="coolmode">

  <button>

    Click Me for Cool Effect!

  </button>

</ClickFusion>

Customization

You can customize the particle image, size, and speed using the particleOptions property.

Particle Options

• particle: (optional) URL for custom particle image
• size: (optional) Size of the particle
• speedHorz: (optional) Horizontal speed of the particle
• speedUp: (optional) Upward speed of the particle

// Code example using all props for Coolmode

<ClickFusion 

    effect="coolmode"

    particleOptions={{

      particle: 'https://pbs.twimg.com/profile_images/1680720685239287808/dVQorGnG_400x400.jpg',

      size: 80,

      speedHorz: 5,

      speedUp: 25

    }}

  >

  <button>

    Click Me for Cool Effect!

  </button>

</ClickFusion>

Custom coolmode in Action