Smooth UI

Overview

SmoothUI is an open-source collection of animated React components built with Tailwind CSS and Motion, designed to drop into shadcn/ui projects. The site describes 228 animated primitives and components, organized into four areas: owned headless primitives, motion-ready components, pre-built page blocks and full starter templates.

The project targets React 19 with Server Components, TypeScript and hooks throughout, and uses Tailwind CSS v4 with a shared token system. Animations use spring physics from Motion (with GSAP in places) and respect reduced-motion settings. SmoothUI is an official shadcn registry under the @smoothui namespace and also ships its own CLI. It is part of the Vercel OSS program.

Features

• Animated components: Includes pieces such as Siri Orb, Dynamic Island, Dock, Number Wave, coverflow carousel and cursor effects.
• AI components: A set of AI interface parts covering messages, prompt input, reasoning, tool calls, citations, sources, diffs and task lists.
• Blocks: 35 page sections including headers, CTAs, FAQs, features, pricing, stats, team, testimonials, logo clouds and footers.
• Themes and dark mode: Light and dark support, several registry themes and a color switcher.
• SmoothUI CLI: Interactive picker that detects the package manager and tsconfig aliases, shows the dependency tree and installs npm dependencies.
• MCP support: Setup for AI assistant integration is documented in the README.
• Accessibility and types: Full TypeScript definitions and reduced-motion-aware animations.

Tech stack

• React 19, Next.js, TypeScript
• Tailwind CSS v4, shadcn/ui, Base UI
• Motion, GSAP, lucide-react

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @smoothui/component-name