AnimateGL Animations for WordPress

Demo | Documentation | Support

Add CSS and WebGL animations easily to any element on the website with AnimateGL plugin.

Add CSS and WebGL animations in Elementor, Block editor or any other builder. Customize direction, duration, delay and easing for each animation. Choose simple CSS animations like fade, slide, zoom and wipe or creative WebGL animations like bend, flip, stretch or directional fade. Create custom entrance animation with visual editor. AnimateGL is lightweight, fast, and easy to use, making it the perfect choice for web designers looking to enhance their website’s visual appeal.

Features

• Add Entrance animation to any element or block
• CSS Entrance animations Fade, Zoom In, Zoom out, Wipe, Slide Reveal
• WebGL Entrance animations Bend, Flip, Peel, Wipe, Zoom, Directional Fade
• Fully customizable animation direction, duration, delay, easing
• Gutenberg Blocks animations
• Elementor animations
• CSS class animations
• Nested animations
• Lock to scrollbar
• Repeat or play once on first enter the viewport
• Live editor for creating custom animation
• Preset animations
• Scroll triggered Entrance animations
• Easy to use
• Lightweight
• Great performance

CSS animations

CSS entrance animations are GPU accelerated and animate CSS properties opacity, transform and clip path in different combinations. CSS animations can be added to any element or block. Available CSS animations are Fade, Zoom In, Zoom Out, Wipe and Slide with settings for direction, distance, duration, delay and easing. With combination of fade, zoom, direction, easing and delay you can create unlimited number of creative elegant animations. More CSS animations coming soon.

CSS Entrance animations:

• Fade
• Zoom In
• Zoom Out
• Wipe
• Slide

WebGL animations

WebGL animations convert any element to image with html2canvas.js, then apply effects to image with custom GLSL shaders. Best use is for simple elements like heading, button or image. With WebGL we can create effects that are not possible with CSS, like 3D distortions or gradient fade, and add those effects to any element on the page.

WebGL Entrance animations:

• Fade
• Slide
• Stretch
• Bend
• Flip
• Zoom
• Peel

Lightweight

Only 35kb for CSS animations, additional 45kb if WebGL animations are used.

Elementor animations

Read the full description on the official page →