@forgeui
ForgeUI is an animation-first React component library built with Next.js, TypeScript, Tailwind CSS, and Framer Motion. Components include animated-form, animated-otp, bot-detection, framework-agnostic, fraud-card, notification-center, security-card, vault-lock, and visual background effects (auralis, chromatic-fluid, cloudscape, cosmicrift, lumadrift, velaris, velora). Also provides animated-tabs, expandable-card, notification-panel, onboard-card, social-card, spectrum-switcher, stack-ripple, stats-card, text-morph, text-reveal, and text-shimmer. Distributed via the shadcn registry. Source is available for personal and commercial use but redistribution as a UI library is prohibited. Use for: adding distinctive motion-enhanced forms, OTP inputs, and animated background effects to product landing pages or dashboards when visual differentiation and micro-interactions are the priority.
Install this registry
npx shadcn@latest add https://forgeui.in/r/registry.json pnpm dlx shadcn@latest add https://forgeui.in/r/registry.json bunx shadcn@latest add https://forgeui.in/r/registry.json curl -s https://forgeui.in/r/registry.json Components
24 totalAnimated form mimicking account creation with progressive name/password animation and completion checkmarks.
npx shadcn@latest add https://forgeui.in/r/animated-form.json Animated OTP input with glowing digit transitions, inspired by Clerk’s authentication UI and rebuilt with custom behavior.
npx shadcn@latest add https://forgeui.in/r/animated-otp.json Switch tabs smoothly with motion-based underline or highlight effects.
npx shadcn@latest add https://forgeui.in/r/animated-tabs.json A WebGL-powered animated background featuring layered simplex noise, glowing light effects, vignette, and subtle film grain for a dramatic ambiance.
npx shadcn@latest add https://forgeui.in/r/auralis.json Animated radar-style component that simulates real-time bot detection using glowing pulses and scanning motion.
npx shadcn@latest add https://forgeui.in/r/bot-detection.json A WebGL-powered animated fluid effect featuring procedural noise, chromatic glint highlights, and dynamic lighting with film grain.
npx shadcn@latest add https://forgeui.in/r/chromatic-fluid.json A WebGL-powered animated cloud gradient that creates a soft, flowing sky-like background using layered noise and color blending.
npx shadcn@latest add https://forgeui.in/r/cloudscape.json A WebGL-powered animated cosmic background featuring a procedural starfield with twinkling effects and flowing nebula-like wave distortions, rendered in real t…
npx shadcn@latest add https://forgeui.in/r/cosmicrift.json Visually demonstrates cross-framework adaptability using animated stack icons and a glowing pipeline effect.
npx shadcn@latest add https://forgeui.in/r/framework-agnostic.json A security alert card inspired by Clerk's landing page, showcasing blocked emails with smooth hover animations.
npx shadcn@latest add https://forgeui.in/r/fraud-card.json A WebGL-powered animated gradient that produces smooth, flowing light patterns using procedural noise and color blending.
npx shadcn@latest add https://forgeui.in/r/lumadrift.json A WebGL-powered nocturnal glow background with layered simplex noise, soft violet blooms, and a gentle drifting warp.
npx shadcn@latest add https://forgeui.in/r/noctylis.json Beautifully animated mobile UI inspired by Clerk’s product design, showcasing notifications with hover-triggered transitions and customizable content blocks.
npx shadcn@latest add https://forgeui.in/r/notification-center.json Animated onboarding progress card showing three steps with visual loaders, transitions, and completion indicators.
npx shadcn@latest add https://forgeui.in/r/progress-stack.json Dynamic security identity card with animated verification, glowing avatar outline, and infinite character scramble stream, inspired by Clerk’s product design.
npx shadcn@latest add https://forgeui.in/r/security-card.json Interactive spectrum switcher with animated gradients, smooth dropdown transitions, and selectable themed color palettes.
npx shadcn@latest add https://forgeui.in/r/spectrum-switcher.json Animated stacked notification cards ripple open with smooth transitions, showing messages, signups, and billing reminders.
npx shadcn@latest add https://forgeui.in/r/stack-ripple.json A dynamic stats card comparing two individuals with avatars, data points, and animated background graph.
npx shadcn@latest add https://forgeui.in/r/stats-card.json A React component that animates rotating text characters using Motion, customizable by words, interval, styling, and animation timing.
npx shadcn@latest add https://forgeui.in/r/text-morph.json A stylish effect that sequentially fades in text on page load, creating a dynamic reveal.
npx shadcn@latest add https://forgeui.in/r/text-reveal.json A React component that creates an animated text shimmer effect using Motion, customizable by tag, duration, spread, delay, and repeat delay.
npx shadcn@latest add https://forgeui.in/r/text-shimmer.json Animated vault showcasing secure password input with motion effects and interactive hover-based unlock behavior, inspired by Clerk’s product design.
npx shadcn@latest add https://forgeui.in/r/vault-lock.json A WebGL-powered animated background featuring layered simplex noise, multi-color blending, vignette glow, and subtle film grain effects.
npx shadcn@latest add https://forgeui.in/r/velaris.json A WebGL-powered animated radial light effect featuring swirling color streaks, 3D noise-based flow, and dynamic color transitions with film grain.
npx shadcn@latest add https://forgeui.in/r/velora.json