CSS3 Transition Generator

Hover me

Presets

Property

Duration s

Delay s

Timing function

CSS output

Build copy-ready CSS transition code for hover feedback, color changes and UI motion. Live preview on the left; tune and copy on the right.

15 presets: scale, fade, background, shadow, bounce, slide, rotate, blur, letter-spacing, glow and more
30+ transition properties including opacity, transform, box-shadow, filter, backdrop-filter and clip-path
Timing functions: ease, linear, steps(), and spring-like cubic-bezier curves; adjustable duration and delay
Hover the preview to test; runs entirely in the browser