Gradient Animation

Gradients that breathe

Animation built in, not hacked on. Your gradients pulse, flow, and drift—all in real-time, all exportable.

StaticStaticgradientsgradientsarearebackgrounds.backgrounds.AnimatedAnimatedgradientsgradientsareareexperiences.experiences.MovementMovementchangeschangeseverything—coloreverything—colorthatthatbreathes,breathes,pulses,pulses,flowsflowsfeelsfeelsalivealiveininaawaywaythatthatstaticstaticcolorcolornevernevercan.can.

BREATHE

Animation Built In

This is what animation feels like. Not a preview. Not a mockup. Your gradient, breathing right now, at 60 frames per second.

Keyframe Control

Every frame is a choice.

0:00

0:02

0:04

0:06

Loop

Rotation. Scale. Movement. Three axes of animation, each with independent speed and easing. Combine them for motion that feels intentional, not random.

Set your loop duration from 1 to 30 seconds. Every export loops seamlessly.

IIwantedwantedanimationanimationfromfromdaydayone.one.NotNotasasaafeaturefeatureyouyouboltboltononafter—asafter—asthethefoundation.foundation.EveryEveryslider,slider,everyeveryeffect,effect,everyeverymaterialmaterialwaswasbuiltbuiltwithwiththethequestion:question:howhowdoesdoesthisthislooklookwhenwhenit moves?it moves?

Export

MP4. WebM. GIF.
Up to 4K. 60fps.

Every frame renders in the browser. When you're ready, export loops that play anywhere.

Static is boring.

Pick a preset. Customize the motion. Export to video. All in the browser.

Free tier available-Export to PNG, SVG, CSS, GIF, MP4-No watermarks at $8/mo
Animated