#What is Iconiq?

Iconiq is a curated collection of reusable React components with beautiful built-in animations and motion effects. Delivered through the familiar shadcn registry workflow, it lets developers copy, edit, and ship polished, motion-rich interfaces without boilerplate. Built on shadcn/ui primitives with Framer Motion (referred to as Motion), it emphasizes full code ownership so teams can customize every detail while maintaining high-quality interactions.

#Features ⚡️

• Fluid Motion: Smooth animations and micro-interactions powered by Framer Motion.

• Editable Components: Full source access — modify styling, motion, and logic freely.

• shadcn Registry: Install via npx shadcn@latest add @iconiq/component-name.

• Dark Mode Ready: Built-in support for light and dark themes.

• Production Focused: Designed for real product interfaces with attention to UX polish.

#Pros and Cons

#Pros ✅

• High-quality, ready-to-ship motion components.

• Perfect integration with shadcn/ui workflow.

• Full code ownership and easy customization.

• Beautiful, subtle animations that feel premium.

• Open source with MIT license.

#Cons ⚠️

• Early stage project (still growing component library).

• Requires Framer Motion as a dependency.

• Some learning curve for advanced motion customizations.

• Smaller community compared to mainstream libraries.

#Included Components - Templates 🧩

Iconiq offers animated and interactive components such as:

• Text Effects: Dia Text, Shimmer Text, and other typography animations.

• Core UI: Enhanced Accordion, Skeleton, Button, and more.

• Motion Components: Magnetic elements, scroll-driven interactions, and hover effects.

• Other polished components for real product use.

#Pricing 💸

Iconiq is completely free:

• 100% Free and open-source under MIT license.

• No premium tiers.

#Integrations 🧰

• React: Built for React 19 with TypeScript.

• ShadCN/UI: Seamless registry and CLI compatibility.

• Framer Motion: For smooth animations and gestures.

• Tailwind CSS v4: Modern utility-first styling.

• Radix UI: Accessible primitives under the hood.