The latest articles on DEV Community by AstroAnimate (@astroanimate). https://dev.to/astroanimate https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3725188%2F0926a3c0-301f-4621-8f71-72137dbe01a7.png https://dev.to/astroanimate en AstroAnimate Tue, 26 May 2026 07:18:56 +0000 https://dev.to/astroanimate/astroanimate-is-now-live-on-product-hunt-kl4 https://dev.to/astroanimate/astroanimate-is-now-live-on-product-hunt-kl4 <h1> AstroAnimate is now live on Product Hunt ⚡ </h1> <p>A production-ready animation library built specifically for Astro.</p> <p>Current launch components include:</p> <h2> Text Animations </h2> <ul> <li>Fade In Text</li> <li>Typewriter Text</li> <li>CountUp</li> <li>HighlightText</li> </ul> <h2> Core Animations </h2> <ul> <li>Scale In</li> <li>Reveal Image</li> </ul> <h2> Background Effects </h2> <ul> <li>GridDotsBackground</li> </ul> <h2> Navigation </h2> <ul> <li>AnimatedTabs</li> <li>Dock</li> <li>Dropdown</li> </ul> <h2> Cards </h2> <ul> <li>Expandable Card</li> <li>Animated Card</li> <li>Glass Card</li> <li>CardStack</li> <li>JobCard</li> <li>ProductReviewCard</li> <li>ArticleCard</li> </ul> <h2> Forms </h2> <ul> <li>NewsletterPopupCard</li> </ul> <h2> Loaders &amp; Feedback </h2> <ul> <li>Loader</li> <li>Progress Bar</li> </ul> <h2> Buttons </h2> <ul> <li>Animated Button</li> <li>AnimatedBorderButton</li> <li>SlidingOverlayButton</li> <li>GitHubShineButton</li> <li>StaggerTextButton</li> <li>ArrowCTAButton</li> <li>FillHoverButton</li> </ul> <h2> Overlays &amp; Popovers </h2> <ul> <li>Tool Tip</li> </ul> <h2> Data Display </h2> <ul> <li>InfiniteMarquee</li> </ul> <p>Built with:</p> <ul> <li>Zero-JS defaults where possible</li> <li>View Transitions compatibility</li> <li>Performance-first architecture</li> <li>Open source MIT license</li> </ul> <p>🚀 Product Hunt:<br> <a href="https://www.producthunt.com/products/astroanimate?launch=astroanimate" rel="noopener noreferrer">https://www.producthunt.com/products/astroanimate?launch=astroanimate</a></p> <p>🌐 Website:<br> <a href="https://astroanimate.com" rel="noopener noreferrer">https://astroanimate.com</a></p> <p>Would genuinely love feedback from the Astro community ❤️</p> <h1> astro #webdev #opensource #typescript </h1> programming opensource webdev animation