What it is
transitions.dev is a transition library with three interfaces: a catalog of Cascading Style Sheets (CSS) and React examples, an npm command-line interface (CLI) that installs transitions into a project, and an installable agent skill. It includes card resize, number pop-in, modal, menu, text reveal, icon swap, skeleton-loader, and shimmer patterns. The site calls it a collection of essential user interface (UI) transitions for web apps, to copy by hand or use through a coding agent.
This is motion tooling, not a design-token specification. The research found no public statement that it wraps the browser View Transitions application programming interface (API), or that it positions itself against Motion, GreenSock Animation Platform (GSAP), or Framer Motion. Whether it uses the View Transitions API internally is UNVERIFIED.
First principles
A transition is a change in a property over time. Three choices define it: which property changes, how long the change takes, and the easing curve that shapes its speed along the way. A motion system is a small set of durations and curves reused everywhere, so that unrelated parts of an interface move with the same rhythm.
Two consequences follow for a tool like this.
- Consistency is a mapping problem. Most projects already have motion, written ad hoc with one-off durations and curves. Aligning those values to a shared scale often improves an interface more than adding new effects. That is the job the
transitions-polishskill describes. - The primitive decides the behavior. The same visual effect can run on CSS transitions, the View Transitions API, or a JavaScript library. That choice decides browser support, how much code ships, and how a reduced-motion preference is honored. An agent installing a transition needs to know which primitive it is getting.
Who is behind it
The creator is Jakub Antalik, with GitHub handle Jakubantalik and npm publisher handle jakubkubo. The repository was created on 2026-04-21 and last pushed on 2026-09-21. As of September 2026 it had 4,317 GitHub stars and 179 forks. No company or organization was identified; the evidence points to a solo project.
A companion package, transitions-refine, provides a live, agent-driven panel. It adds a timeline UI and feeds suggestions through a coding agent.
Format and how an agent consumes it
There is no formal token schema. The material ships as source snippets, a CLI package, and a skill. The published install paths are:
npx skills add Jakubantalik/transitions.dev
npx skills add Jakubantalik/transitions.dev -s transitions-polish
npx transitions-dev skill
npx transitions-dev add --proThe npm package metadata states the contract compactly:
{
"name": "transitions-dev",
"version": "0.3.0",
"description": "Install transitions.dev UI transitions into your project — CSS, React, and TypeScript. Free transitions work out of the box; Pro recipes and the Pro agent skill unlock after a browser sign-in.",
"bin": {"transitions-dev": "bin/transitions-dev.mjs"},
"engines": {"node": ">=18"},
"license": "MIT"
}An agent can install the general skill, then use it to pick a transition in context, find custom animations in an existing project, and suggest token-scale replacements. The transitions-polish variant is meant to align existing motion to a token scale instead of adding new animations. The research did not inspect the underlying skill package, so its exact structure is UNVERIFIED.
Pricing and access
The base catalog, CLI, and skill are free. Transitions Pro unlocks Pro recipes, a Pro skill, and the Refine tool after a browser sign-in. The exact price was not visible in the research and is UNVERIFIED. The npm metadata describes transitions-refine as a live, agent-driven panel for CSS and Motion transitions.
What works
The project gives a focused problem a direct installation path. A user can copy a transition, ask an agent to install one, or use the CLI. That is a good distribution model for a narrow library: several ways in, one clear artifact at the end.
It also treats motion cleanup as its own job. A skill that spots ad hoc durations and curves and aligns them to a scale is more useful than a catalog that only adds effects. The project was active on npm and GitHub in September 2026.
What does not
The public documentation says little about the underlying primitives. A design engineer needs to know whether a transition is native platform behavior, CSS, JavaScript, Motion, or an abstraction with different compatibility limits. The research did not establish that.
The more advanced agent logic is Pro-gated. There is no interoperability story with a motion token format or with established libraries. The project also carries the usual continuity risk of a solo-maintainer tool.
What we take from it
Velofy could propose the same distribution shape: a browsable reference, a CLI, and an installable skill. It could propose a “polish” workflow that normalizes existing motion before adding new effects. Velofy has not shipped any of those tools, and it has no npm package or Model Context Protocol (MCP) server.
The improvement would be to publish the primitive, token model, and compatibility boundary for every motion recipe. Design guidance is more useful when an agent can see not only what to use, but what it is built on and how to validate it.