automotion.dev – Converts UI screenshots into production-ready motion code

Summary: Automotion.dev analyzes UI screenshots to generate professional motion code with accurate easing curves, stagger timing, and physics-based animations. It integrates with Claude Code via MCP to provide brand-consistent, production-ready animations without manual tweaking.

What it does

Users upload UI screenshots, and Automotion analyzes visual hierarchy, motion style, and component relationships to produce full HTML/CSS/JS code, Tailwind-ready snippets, and React, CSS, or Framer Motion code with real easing curves. It also offers an API and terminal integration through Claude for seamless motion design workflows.

Who it's for

Developers and designers seeking precise, brand-aligned motion code for UI components without spending hours manually adjusting animations or relying on generic AI-generated effects.

Why it matters

Automotion solves the problem of generic, repetitive AI animations by applying motion design principles to create smooth, hierarchy-aware, and style-matching animations that are production-ready and easy to integrate.