Free Animation Tools — CSS, SVG & Keyframes
Generate CSS animations, SVG paths, and keyframe sequences for your web projects. No signup required.
CSS Animation (14)
CSS Keyframe Builder
Compose @keyframes visually
CSS Transition Builder
Design CSS transitions
CSS Animation Preview
Live preview any CSS animation
CSS Timing Function Editor
Cubic bezier curve editor
CSS Animation Delay Planner
Plan delays across elements
CSS Transform Animator
Animate translate, rotate, scale
CSS Animation Chaining Tool
Chain multiple animations
CSS Scroll Animation Builder
Scroll-driven CSS animations
CSS Parallax Effect Builder
Layered parallax effects
CSS 3D Transform Animator
Animate in 3D space
CSS Animation Library Browser
Browse ready-made animations
CSS Text Animation Builder
Text-specific animations
CSS Loading Spinner Maker
Design loading spinners
CSS Animation Code Exporter
Export clean CSS code
SVG Animation (12)
SVG Animation Editor
Edit SVG animations visually
SMIL Animation Builder
Build SMIL-based animation
SVG Path Animation Tool
Animate paths over time
SVG Morph Animator
Morph between SVG shapes
SVG Stroke Dash Animator
Animate stroke-dasharray
SVG Animate Transform Tool
Animate SVG transforms
SVG Motion Path Builder
Move along motion paths
SVG Clip Path Animator
Animate SVG clip-paths
SVG Mask Animator
Animate SVG masks
SVG Gradient Animator
Animate SVG gradients
SVG Lottie Builder
Build Lottie from SVG
SVG Animation Optimizer
Optimize SVG animations
Lottie & JSON Animation (8)
Lottie File Previewer
Preview any .lottie / .json
Lottie Speed Controller
Tune playback speed
Lottie Color Editor
Recolor Lottie layers
Lottie Frame Inspector
Inspect individual frames
Lottie Loop Planner
Plan loop ranges
Lottie to GIF Converter
Convert Lottie to GIF
Lottie to MP4 Converter
Convert Lottie to MP4
Lottie Asset Manager
Manage Lottie assets
Sprite & Frame Animation (10)
Sprite Sheet Animator
Animate from a sprite sheet
Sprite Sheet Slicer
Slice sheets into frames
Flipbook Animator
Old-school flipbook animations
Frame-by-Frame Animator
Hand-keyed frame animation
Pixel Art Animator
Animate pixel art
GIF Maker
Compose GIFs from frames
GIF Editor
Edit GIF frames and timing
GIF Optimizer
Shrink GIF size
GIF Speed Controller
Change GIF playback speed
GIF Frame Extractor
Extract frames from GIF
Canvas & WebGL Animation (12)
Canvas Particle System
Particle systems on canvas
Canvas Wave Animator
Wave & sine animations
Canvas Fireworks Generator
Fireworks on canvas
Canvas Physics Simulator
Simple physics playground
Canvas Cloth Simulator
Cloth-style mesh simulation
Canvas Ripple Effect
Interactive ripples
WebGL Shader Preview
Preview GLSL shaders
WebGL Geometry Animator
Animate 3D geometry
WebGL Terrain Animator
Animated terrain
WebGL Fluid Simulator
Fluid dynamics demo
Canvas Confetti Animator
Confetti bursts
Canvas Spirograph Maker
Generate spirograph art
Motion Design (12)
Easing Curve Visualizer
Visualize easing curves
Motion Blur Preview
Preview motion blur
Squash & Stretch Animator
Classic squash and stretch
Anticipation & Follow Through Preview
Preview anticipation
Timing Chart Builder
Animator's timing charts
Motion Path Visualizer
Visualize complex motion paths
Keyframe Timeline Builder
Build keyframe timelines
Stagger Animation Builder
Staggered reveal builder
Spring Physics Animator
Spring-based motion
Bounce Animation Builder
Bounce effect presets
Overshoot Animator
Overshoot motion preview
Inertia Effect Preview
Friction and inertia demo
UI & Microinteractions (10)
Button Hover Animation Builder
Hover effects for buttons
Toggle Animation Designer
Animated switch/toggles
Checkbox Animation Maker
Custom checkbox states
Like Button Animation
Heart/like burst animations
Loading State Animator
Skeleton loaders & spinners
Progress Animation Builder
Progress bar transitions
Notification Bounce Animator
Notification toasts
Card Flip Animator
3D card flip effects
Drawer Slide Animator
Off-canvas menus
Tab Transition Builder
Tab switching effects
Typography & Text (10)
Typewriter Effect Builder
Classic typewriter text
Text Fade-in Animator
Smooth text reveals
Word Shuffle Animator
Random character decode
Letter Scramble Animator
Hacker-style scramble
Text Glitch Animator
Cyberpunk glitch effects
Kinetic Typography Builder
Kinetic text layouts
Scroll-Triggered Text Revealer
Reveal on scroll
Word-by-Word Animator
Staggered word reveal
Text Path Animator
Text along SVG path
Countdown Timer Animator
Animated countdowns
Export & Conversion (8)
Animation to GIF Exporter
Export web animations to GIF
Animation to MP4 Exporter
Export to video
Animation to Lottie Exporter
Convert to JSON
Animation to APNG Exporter
Export as APNG
Animation to WebP Exporter
Export as animated WebP
Animation Frame Exporter
Extract PNG sequence
Animation Speed Validator
Validate playback performance
Animation File Size Optimizer
Optimize file sizes
Specialized & Creative (10)
Generative Art Animator
Generative animated art
Wave Function Collapse Animator
WFC visualizations
Procedural Tree Animator
Grow procedural trees
Fractal Zoom Animator
Zoom into fractals
Noise Field Animator
Perlin/simplex noise fields
Voronoi Diagram Animator
Animated Voronoi
Reaction-Diffusion Simulator
Reaction-diffusion patterns
Cellular Automata Animator
Cellular automata
L-System Plant Animator
L-system plant growth
Mandelbrot Zoom Tool
Zoom into the Mandelbrot set
Accessibility & QA (10)
Animation Reduced Motion Checker
Check reduced-motion support
Animation Speed Accessibility Tester
Test speed accessibility
Flicker Frequency Checker
Seizure safety check
Animation Contrast Checker
Check contrast during motion
Animation Duration Auditor
Audit animation durations
CSS Prefers-Reduced-Motion Preview
Preview reduced motion
Animation Complexity Grader
Grade animation complexity
Frame Rate Drop Simulator
Simulate FPS drops
Animation Performance Estimator
Estimate runtime cost
Animation A11y Documentation Tool
Generate a11y docs