Plugin details
Plugin Elements
1. Anime.js Logo Animation
This element displays an animated Anime.js logo.
Customization Options:
Colors: Customizable primary and secondary colors for the logo.
Animation Speed: Adjustable animation duration.
Text Animations
2. Moving Letters
A text element with 16 built-in animations to bring your text to life.
Animations Available:
TwinLines
FloatIn
FadeIn
ReadySetGo
SlideOpen
BubbleUp
Skate
Pop
Bounce
Window
Type
ElegantSlide
WindFlow
Underline.Reveal
SmoothDrop
Customization Options:
Text Content: Enter your custom text.
Animation Style: Select one of the 16 animations.
Animation Speed: Adjust animation speed (in ms).
Text Styling: Font size, color, weight, etc.
Organic Shapes
3. Organic Shapes with Hover Animations
Adds organic shapes to your design with 9 hover-triggered animations.
Customization Options:
Shape Color: Customizable fill and stroke colors.
Hover Animation Style: Choose from the 9 pre-made effects.
Size: Adjust the dimensions of the shape.
SVG Morpher
5. Morpher
The Morpher enables custom animations for SVGs within HTML elements using IDs in the format morph-{style}-loop.
How It Works:
Add your custom SVGs within a Bubble HTML element.
Assign an ID following the pattern: morph-{animationStyle}-loop (e.g., morph-expand-loop).
The plugin automatically detects and animates the SVG.
Customization Options:
Animation Styles: Add your preferred morphing styles.
Loop Settings: Enable or disable looping animations.