animated-component-libraries

This skill provides expertise in pre-built animated React component libraries, specifically Magic UI and React Bits. These libraries offer production-ready, animated components that significantly accelerate development of modern, interactive web applications.

Magic UI provides 150+ TypeScript components built on Tailwind CSS and Framer Motion, designed for seamless integration with shadcn/ui. Components are copy-paste ready and highly customizable.

React Bits offers 90+ animated React components with minimal dependencies, focusing on visual effects, backgrounds, and micro-interactions. Components emphasize performance and ease of customization.

مجموعات مكونات React المتحركة المعدة مسبقًا والتي تجمع بين Magic UI (150+ مكون TypeScript/Tailwind/Motion) وReact Bits (90+ مكونًا متحركًا منخفض التبعية). استخدم هذه المهارة عند إنشاء صفحات مقصودة أو مواقع تسويقية أو لوحات معلومات أو واجهات مستخدم تفاعلية تتطلب مكونات متحركة معدة مسبقًا بدلاً من الرسوم المتحركة المصنوعة يدويًا. تشغيل المهام التي تتضمن مكونات واجهة مستخدم متحركة، أو Magic UI، أو React Bits، أو تكامل shadcn/ui، أو مكونات Tailwind CSS، أو اختيار مكتبة المكونات. بديل لتنفيذ الرسوم المتحركة يدويًا باستخدام Framer Motion أو GSAP. المصدر: freshtechbro/claudedesignskills.