A garden of SVG + CSS animations
74 self-contained snippets you can preview live, customize, and copy.
Every one works when pasted into a blank .html file — no frameworks, no build step,
and each comes with a short lesson on how it works.
New backgrounds advanced backgroundaurorablend-mode
New backgrounds intermediate backgroundstarsconstellation
New backgrounds intermediate backgroundpatterndots
New backgrounds advanced backgroundwireframepseudo-3d
New backgrounds advanced backgroundrainturbulence
New backgrounds advanced backgroundtopographicmorph
New backgrounds advanced backgroundwavesdivider
New buttons intermediate buttonborderdraw
New buttons intermediate buttonspringeasing
New buttons advanced buttongoofilter
New buttons advanced buttonliquidclip-path
New buttons advanced buttonfillhover-zones
New buttons advanced buttonneondasharray
New buttons intermediate buttonclip-pathsplit
New buttons advanced buttonstate-machinespinner
New charts intermediate chartbarsstagger
New charts advanced chartdonutconic-gradient
New charts intermediate chartheatmapcalendar
New charts advanced chartlinetooltip
New charts advanced chartsparklinelive
New charts intermediate chartradarpulse
New filters advanced filterglitchdisplacement
New filters advanced filterelectricglow
New filters advanced filterglassbackdrop
New filters advanced filtergooliquid
New filters intermediate filterheatshimmer
New filters advanced filtermaskink
New filters intermediate filterpaperlayers
New filters advanced filterwaterripple
New gauges intermediate gaugebatterycharging
New gauges intermediate gaugepercentageslider
New gauges advanced gaugespeedometerneedle
New hover intermediate hovercardborder
New hover beginner hoverarrowlink
New hover intermediate hovermenuhamburger
New hover beginner hoverstarrotate
New interactive intermediate interactivecard3d
New interactive intermediate interactiveaccordiondetails
New interactive advanced interactivetogglecheckbox
New interactive advanced interactiveslideremoji
New interactive advanced interactiveratingstars
New interactive intermediate interactivepasswordtoggle
New loaders beginner loaderdasharraykeyframes
New loaders beginner loaderringcounter-rotate
New loaders advanced loaderhourglassflip
New loaders beginner loaderprogressbar
New loaders intermediate loaderorbitrotate
New loaders beginner loaderdotsstagger
New morph advanced morphblobsmil
New morph advanced morphplaypause
New motion-path advanced motionsmilbee
New motion-path intermediate motionsmilcomet
New motion-path advanced motionorbitplanets
New motion-path advanced motionsmilplane
New motion-path intermediate motionsmiltrain
New scroll advanced scrollsceneday-night
New scroll advanced scrollgaugeprogress
New scroll advanced scrollparallaxlayers
New scroll advanced scrollrevealclip-path
New scroll advanced scrolldrawprogress
New scroll intermediate scrollbadgetextPath
New stroke-draw intermediate drawsuccesscheckmark
New stroke-draw intermediate drawcircuitstagger
New stroke-draw beginner drawsignaturedashoffset
New stroke-draw beginner drawunderlinetext-decoration
New text intermediate textoutlinedashoffset
New text intermediate texttextPathsmil
New text beginner textwavestagger
New text-fx intermediate text3dperspective
New text-fx advanced textmaskknockout
New text-fx advanced textclip-pathliquid
New text-fx intermediate textmarqueetextPath
New text-fx advanced textscrambledecode
New text-fx advanced textvariable-fontproperty
No snippets match — try a broader search.