Animations these days are simple to make with the right mindset on approaching them. But as simple as they sound, others turn to make them more complicated than they think. Here are a bunch of handcrafted animated components. build using your favorite existing tools like nextjs/reactjs, tailwindcss and framer-motion.
From carousel, cards, inputs, and more
visit framer ground for more <a href="https://ground.bossadizenith.me" target="_blank" rel="noopener nofollow">here</a>
<img src="https://media.daily.dev/image/upload/s--8MBX8kQX--/f_auto/v1726603309/ugc/content_dc33215a-e8c5-44ab-9bcd-7adc5d14e1c8" alt="Screenshot from 2024-09-06 20-04-48">
<img src="https://media.daily.dev/image/upload/s--UdjnUy6J--/f_auto/v1726603371/ugc/content_f31a5998-97ce-46d6-b9c7-d960c4da1f6c" alt="Screenshot from 2024-09-06 20-04-28">

Get 1% better daily. Development resource sharing made easy. Post, comment, or upvote to show your contribution and support other developers! 🙌

⚠️ Please do not post any promotional resources.

Dev Squad

Animations have become easier to create with modern tools. This post introduces a set of handcrafted animated components built using Next.js, React, TailwindCSS, and Framer Motion, including elements like carousels, cards, and inputs. Check out Framer Ground for more examples.

Ground. your animation kit

I love how it follows the headless style of ShadCn. I’m a big fan of copying and pasting only what I need. I quite like the Sparkles &amp; Liquid Morph buttons. Great work!