SmoothUI

Installation

Learn how to install SmoothUI components using shadcn CLI or manual installation methods.

Last updated: November 8, 2025

Installation (Official Registry)

SmoothUI is an official shadcn registry, so you can install components directly without any configuration. Just use the @smoothui namespace.

No Configuration Required

Since SmoothUI is an official registry, you don't need to add anything to your components.json file. Just install components directly!

Install Components

Install SmoothUI components using the shadcn CLI with the @smoothui namespace:

# Install a single component
pnpm dlx shadcn@latest add @smoothui/siri-orb

# Install multiple components
pnpm dlx shadcn@latest add @smoothui/rich-popover @smoothui/animated-input

# Install components with dependencies
pnpm dlx shadcn@latest add @smoothui/scrollable-card-stack
# Install a single component
npx shadcn@latest add @smoothui/siri-orb

# Install multiple components
npx shadcn@latest add @smoothui/rich-popover @smoothui/animated-input

# Install components with dependencies
npx shadcn@latest add @smoothui/scrollable-card-stack
# Install a single component
yarn dlx shadcn@latest add @smoothui/siri-orb

# Install multiple components
yarn dlx shadcn@latest add @smoothui/rich-popover @smoothui/animated-input

# Install components with dependencies
yarn dlx shadcn@latest add @smoothui/scrollable-card-stack
# Install a single component
bunx shadcn@latest add @smoothui/siri-orb

# Install multiple components
bunx shadcn@latest add @smoothui/rich-popover @smoothui/animated-input

# Install components with dependencies
bunx shadcn@latest add @smoothui/scrollable-card-stack

Use Components

Import and use the installed components in your React application:

import { SiriOrb } from "@/components/smoothui/ui/SiriOrb"
import { RichPopover } from "@/components/smoothui/ui/RichPopover"

export default function App() {
  return (
    <div>
      <SiriOrb size="200px" />
      <RichPopover />
    </div>
  )
}