Motiq

Overview

Motiq is a free, open-source library of animated React components and complete workflows, delivered as editable TypeScript and Tailwind source through a shadcn-compatible registry. The site lists 86 released components, 8 workflow blocks and 4 one-command packs.

Motiq positions itself as a motion system for product interfaces rather than a collection of effects. Components are application-controlled, so the host app owns state and there is no backend lock-in. Each item is described as keyboard-safe, reduced-motion aware and RSC-safe, and composed blocks combine several components into one installable workflow. Development is funded through sponsorships.

Features

• AI interfaces: AI response stream, agent run timeline, tool call activity, prompt composer and source citation rail.
• Developer tools: Deployment pipeline, live log stream, API request inspector, webhook event stream and environment switcher.
• Data motion: KPI number morph, streaming data rows, data refresh states and data quality status.
• Collaboration and accounts: Comment threads, mention suggestions, typing and presence, passkey and two-factor setup flows.
• Workflow blocks: AI agent workspace, deployment command center, collaborative review workspace and live operations dashboard.
• Packs: AI Interface, Developer Tools, Collaboration and Data Motion packs install with one command.
• Extras: Workflow heroes, ambient backgrounds, text animations, animated shadcn primitives and animated icons.

Tech stack

• React, Next.js, TypeScript, Tailwind CSS, motion, Radix UI, shadcn registry

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @motiq/component-name