Free Animated Shadcn UI Components: Cult UI

When an agent builds a landing page from zero, the cards and buttons on it almost always look the same: a flat background, an ordinary shadow, no motion at all. I look for ready pieces of interface for exactly this reason, so that I do not have to explain every animation to the agent in words.

This week I found a set that fits this task directly. The authors describe it as a collection of more than 150 free animated components, and 58 of them were added quite recently. Everything is open and free, under the MIT license.

The components are built on top of shadcn/ui and Tailwind CSS version four, and the animation runs through the Motion library. One detail matters here: the install command does not drop a third-party package into the project. It copies the source code of the component straight into your files, and after that it is fully your own code, which you can change in any way. This method also brings a limit. The components are meant for a project that already runs React, Tailwind and shadcn/ui, and they cannot simply be pasted into a plain static HTML site without a build step.

1How to use it

The simplest way is to install one component directly from its file link in the Cult UI catalog. The command can be handed to the agent, and it will run it in the project terminal itself.

npx shadcn@latest add https://www.cult-ui.com/r/shift-card.json

If you need more than one component from Cult UI, there is a more convenient way. You register the catalog once as a separate source inside the components.json file, and after that you can install components simply by name.

{
  "registries": {
    "@cult-ui": "https://www.cult-ui.com/r/{name}.json"
  }
}

npx shadcn@latest add @cult-ui/shift-card

There is one more option, a server of its own on the MCP protocol. If the agent runs inside Cursor, Claude Code or VS Code, it can use this server to find and install a component from a plain text description by itself, without you looking up the component link by hand.