First run
- Step 1
Turn on Rain of Hearts and set the activity threshold that triggers the effect.
- Step 2
Select the number of particles, their maximum number and the interval between series.
- Step 3
In appearance, adjust the size, movement, color and available graphics.
- Step 4
Save, test and check whether the effect does not obscure important elements of the broadcast.
Broadcast example
With subsequent waves of likes, the screen fills with a short series of hearts. The threshold and spacing control the frequency, and the simultaneous particle limit limits the number of elements on the screen.
Action and possibilities
Threshold and series
Set the number of events needed to trigger the effect, the number of hearts and the interval between sets. Series parameters allow you to adjust the reaction to the intensity of likes.
Particles
Size, speed, start of movement, spread and rotation determine the animation. You can use available icons and avatars. Viewer data is only shown if the source has provided it.
Limit on screen
The maximum number of particles limits the simultaneous effect. Appearance configuration is in the overlay panel; there is no mandatory selection of Simple / Default / Modernist here.
See the interface up close
Click on the illustration to enlarge it. The screenshots show different parts of the setup; the caption explains what to look out for.
Settings and available selections · 133
The list describes the fields of this tool and its binding. Some settings appear after enabling the parent option, adding a rule, connecting the platform or changing the style. Availability may vary by plan. Lists of your own files, votes and connected accounts are populated in your dashboard.
There are no settings matching your search.
Likes needed to triggerNumber
The number or value of events required to trigger the reaction.
Settings
: 1 … 100000
Hearts per triggerNumber
The number of elements or molecules created by the specified function.
Settings
: 1 … 12
Maximum on screenNumber
The upper limit of the indicated size.
Settings
: 5 … 2000 · 1
Per-viewer cooldown (s)Number
The minimum interval between runs of this rule, in seconds. It does not intentionally delay each received message.
Settings
: .2 … 30 · .1
Reset tap streak after inactivity (s)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Settings
: .5 … 15 · .5
X position · horizontalZipper
The horizontal position of the element in the source area. The preview converts it to the dimensions of the selected resolution.
Position within stream resolution
: 0 … 100 · 0.1
Y position · verticalZipper
The vertical position of the element in the source area. The preview converts it to the dimensions of the selected resolution.
Position within stream resolution
: 0 … 100 · 0.1
Overlay size (%)Zipper
The size of the element relative to its base size, in percent.
Position within stream resolution
: 10 … 300 · 1
Overlay opacityZipper
Opacity of the entire element in percentage. You set the transparency of the background itself separately.
Position within stream resolution
: 0 … 100 · 1
Heart launch positionSelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Settings
Choices available: Bottom right · Bottom left · Bottom center · Top right · Top left · Top center · Center
Heart size (px)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Settings
: 16 … 280
Animation duration (s)Number
The length of time the selected item is displayed or active.
Settings
: 2 … 30
Movement directionSelection list
Chooses to add or subtract time.
Settings
Choices available: Random in all directions · Scatter across the screen · Only upwards
Group direction spread (°)Zipper
Drag the slider, observing the value and preview. The save saves the selected level.
Settings
: 0 … 180
Random initial rotation ±°Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Settings
: 0 … 360
Random rotation speed (°/s)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Settings
: 0 … 360
Random size variation (%)Zipper
Drag the slider, observing the value and preview. The save saves the selected level.
Settings
: 0 … 60
Random speed variation (%)Zipper
Drag the slider, observing the value and preview. The save saves the selected level.
Settings
: 0 … 80
Floating speed (px/s at 1080p)Number
Movement speed of animated elements.
Settings
: 30 … 600 · 10
Animation endingSelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Settings
Choices available: Drift away and fade · Pop like a balloon
Drift / pop duration (s)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Settings
: .2 … 4 · .1
Bounce off screen edgesSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Settings
Show avatarsSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Settings
Viewer avatar displaySelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Settings
Choices available: With each viewer heart group · Every N hearts
Avatar every this many emitted heartsNumber
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Settings
: 1 … 1000
Particle avatar size (px)Number
Avatar size.
Settings
: 16 … 240
Show viewerSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Settings
Heart colorsSelection list
The main color of the indicated part. The effect depends on the section in which the field appears.
Settings
Choices available: One fixed color · One random color per viewer per stream · A random color for every heart
ColorColor
The main color of the indicated part. The effect depends on the section in which the field appears.
Settings
Overlay opacityZipper
Opacity of the entire element, including text and graphics. It is independent of the opacity of the background itself.
Settings
: .05 … 1 · .05
Heart size (px)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Text styling and animation
: 16 … 280
Particle avatar size (px)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Text styling and animation
: 16 … 240
ColorColor
The main color of the indicated part. The effect depends on the section in which the field appears.
Text styling and animation
Text colorColor
Text color.
Text styling and animation
Second colorColor
The second color to finish the gradient.
Text styling and animation
GradientSwitch
Enables a transition between two colors in this part of the element.
Text styling and animation
Text sizeNumber
Base text size in pixels.
Text styling and animation
: 12 … 72
Padding (px)Number
Internal distance of content from edges.
Text styling and animation
: 0 … 64
Text alignmentSelection list
Alignment of text or content in an element.
Text styling and animation
Choices available: Left · Center · Right
Enable frameSwitch
Enables a frame or border for an item.
Text styling and animation
Frame styleSelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Text styling and animation
Choices available: Wavy frame · Classic card · Glass · Outline · Neon · Minimal · Broadcast stripe · Rounded card
Border styleSelection list
How to draw a border.
Text styling and animation
Choices available: Solid · Dashed · Dotted · Double · Wavy
Border colorColor
Border color.
Text styling and animation
Second colorColor
The second color to finish the gradient.
Text styling and animation
GradientSwitch
Enables a transition between two colors in this part of the element.
Text styling and animation
Border width (px)Number
Border thickness.
Text styling and animation
: 0 … 8
Corner radiusNumber
Corner rounding radius.
Text styling and animation
: 0 … 60
Neon glow strengthZipper
The intensity of the neon glow.
Text styling and animation
: 0 … 80
Shadow opacityZipper
Visibility of the neon glow, independent of the main opacity of the element.
Text styling and animation
: 0 … 1 · .05
Enable backgroundSwitch
Turns on the background of the selected element.
Text styling and animation
Background colorColor
The background color of the element.
Text styling and animation
Second colorColor
The second color to finish the gradient.
Text styling and animation
GradientSwitch
Enables a transition between two colors in this part of the element.
Text styling and animation
Background opacityZipper
Covering only the background, without intentionally extinguishing text and content.
Text styling and animation
: 0 … 1 · .05
Element / frame shadowSwitch
Turns on the shadow of this part of the element.
Text styling and animation
Shadow blur / strengthZipper
The intensity or size of an element's shadow.
Text styling and animation
: 0 … 80
Shadow colorColor
The main color of the indicated part. The effect depends on the section in which the field appears.
Text styling and animation
Shadow opacityZipper
Shadow coverage. Changes the visibility of the shadow without intentionally changing the opacity of the text or background.
Text styling and animation
: 0 … 1 · .05
Horizontal shadow (px)Number
Horizontal shift of the shadow relative to the element.
Text styling and animation
: -60 … 60
Vertical shadow (px)Number
The vertical shift of the shadow relative to the element.
Text styling and animation
: -60 … 60
Element entrance and exit animationSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Text styling and animation
Entrance animationSelection list
An effect triggered when an element appears.
Text styling and animation
Choices available: None · Fade · Slide from left · Slide from right · Slide up · Slide down · Zoom · Bounce · Soft pop · Rotate · 3D flip · Diagonal drift
Exit animationSelection list
An effect triggered when an element disappears.
Text styling and animation
Choices available: None · Fade out · Slide out to the left · Slide out to the right · Fade upward · Slide out downward · Zoom out · Bounce out · Expand and fade · Rotate and fade · Flip and fade · Drift away
Animation duration (s)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Text styling and animation
: 0 … 2 · .05
Enable text effectsSwitch
Enables this rule or feature. Data recording itself does not replace turning on the tool and connecting to an active LIVE.
Text effects
Text entrance animationSelection list
An effect triggered when an element appears.
Text effects
Choices available: None · Typewriter · Fade in · Text rise · Text zoom · Text slide
Text entrance duration (s)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Text effects
: .2 … 8
Animation while visibleSelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Text effects
Choices available: No continuous animation · Left to right wave · Bouncing letters · Pulsing glow · Text pulse · Gentle floating · Swaying letters
Animation cycle (s)Number
Movement speed of animated elements.
Text effects
: .4 … 10
Overlay opacityZipper
Opacity of the entire element, including text and graphics. It is independent of the opacity of the background itself.
Text effects
: .05 … 1 · .05
Custom text colorSwitch
The main color of the indicated part. The effect depends on the section in which the field appears.
Text effects
Text colorColor
The main color of the indicated part. The effect depends on the section in which the field appears.
Text effects
Second colorColor
The second color to finish the gradient.
Text effects
GradientSwitch
Enables a transition between two colors in this part of the element.
Text effects
Text shadowSwitch
Turns on the shadow of this part of the element.
Text effects
Shadow colorColor
The main color of the indicated part. The effect depends on the section in which the field appears.
Text effects
Shadow opacityZipper
Shadow coverage. Changes the visibility of the shadow without intentionally changing the opacity of the text or background.
Text effects
: 0 … 1 · .05
Shadow blur / strengthNumber
Blur the edges of the shadow.
Text effects
: 0 … 60
Horizontal shadow (px)Number
Horizontal shift of the shadow relative to the element.
Text effects
: -40 … 40
Vertical shadow (px)Number
The vertical shift of the shadow relative to the element.
Text effects
: -40 … 40
Text outlineSwitch
Turns on the text outline.
Text effects
Border colorColor
The main color of the indicated part. The effect depends on the section in which the field appears.
Text effects
Text outline width (px)Number
Letter stroke thickness.
Text effects
: .2 … 4
Repeat show and hide cycleSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Text styling and animation
Show for (s)Number
Determines whether the specified item is visible in this configuration. Enabling does not create missing platform data.
Text styling and animation
: 1 … 3600
Hide for (s)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Text styling and animation
: 1 … 3600
Heart launch positionSelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Text styling and animation
Choices available: Bottom right · Bottom left · Bottom center · Top right · Top left · Top center · Center
Stream width (px)Number
The width of the browser source area in pixels.
Text styling and animation
: 320 … 7680
Stream height (px)Number
The height of the browser source area in pixels.
Text styling and animation
: 240 … 4320
Horizontal margin (px)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Text styling and animation
: 0 … 2000
Vertical margin (px)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Text styling and animation
: 0 … 2000
Show this viewSwitch
Determines whether the specified item is visible in this configuration. Enabling does not create missing platform data.
Text styling and animation
Show viewerSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Text styling and animation
Customize this elementSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Overlay element
Individual opacitySwitch
Opacity of the entire element, including text and graphics. It is independent of the opacity of the background itself.
Overlay element
Overlay opacityZipper
Opacity of the entire element, including text and graphics. It is independent of the opacity of the background itself.
Overlay element
: .05 … 1 · .05
Animate this elementSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Overlay element
Entrance animationSelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Overlay element
Choices available: Floating · Pulsing · Rotation · Bouncing
Animation cycle (s)Number
Movement speed of animated elements.
Overlay element
: .4 … 10 · .1
Override text stylingSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Overlay element
Enable text effectsSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Overlay element
Text entrance animationSelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Overlay element
Choices available: None · Typewriter · Fade in · Text rise · Text zoom · Text slide
Text entrance duration (s)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Overlay element
: .2 … 8
Animation while visibleSelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Overlay element
Choices available: No continuous animation · Left to right wave · Bouncing letters · Pulsing glow · Text pulse · Gentle floating · Swaying letters
Animation cycle (s)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Overlay element
: .4 … 10
Overlay opacityZipper
Opacity of the entire element, including text and graphics. It is independent of the opacity of the background itself.
Overlay element
: .05 … 1 · .05
Custom text colorSwitch
The main color of the indicated part. The effect depends on the section in which the field appears.
Overlay element
Text colorColor
The main color of the indicated part. The effect depends on the section in which the field appears.
Overlay element
Second colorColor
The second color to finish the gradient.
Overlay element
GradientSwitch
Enables a transition between two colors in this part of the element.
Overlay element
Text shadowSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Overlay element
Shadow colorColor
The main color of the indicated part. The effect depends on the section in which the field appears.
Overlay element
Shadow opacityZipper
Opacity of the entire element, including text and graphics. It is independent of the opacity of the background itself.
Overlay element
: 0 … 1 · .05
Shadow blur / strengthNumber
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Overlay element
: 0 … 60
Horizontal shadow (px)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Overlay element
: -40 … 40
Vertical shadow (px)Number
Set a numeric value for this option. The range below shows the limitations of the form; some features have additional plan limits.
Overlay element
: -40 … 40
Text outlineSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Overlay element
Border colorColor
The main color of the indicated part. The effect depends on the section in which the field appears.
Overlay element
Text outline width (px)Number
The width of the source or element indicated by this section.
Overlay element
: .2 … 4
Show imageSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Text styling and animation
Customize this elementSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Overlay element
Individual opacitySwitch
Opacity of the entire element, including text and graphics. It is independent of the opacity of the background itself.
Overlay element
Overlay opacityZipper
Opacity of the entire element, including text and graphics. It is independent of the opacity of the background itself.
Overlay element
: .05 … 1 · .05
Animate this elementSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Overlay element
Entrance animationSelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Overlay element
Choices available: Floating · Pulsing · Rotation · Bouncing
Animation cycle (s)Number
Movement speed of animated elements.
Overlay element
: .4 … 10 · .1
Show iconsSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Text styling and animation
Customize this elementSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Overlay element
Individual opacitySwitch
Opacity of the entire element, including text and graphics. It is independent of the opacity of the background itself.
Overlay element
Overlay opacityZipper
Opacity of the entire element, including text and graphics. It is independent of the opacity of the background itself.
Overlay element
: .05 … 1 · .05
Animate this elementSwitch
Enables or disables the option indicated in the label. Dependent options may only appear after you enable it.
Overlay element
Entrance animationSelection list
Select a variant from the available list. The meaning of the selection is evident from the label and settings section; the change requires saving the configuration.
Overlay element
Choices available: Floating · Pulsing · Rotation · Bouncing
Animation cycle (s)Number
Movement speed of animated elements.
Overlay element
: .4 … 10 · .1
When something doesn't work
The effect does not fire every time it is liked
Check your threshold and interval between sets. The rule can wait until the required number of events are collected.
More items cannot be set
Check your plan limit. A value above the available limit will not increase the actual particle count.