FloatingStatsCards

About

StatPulse brings smooth, animated, and interactive metric cards to your Framer projects. Drop it into a hero section, dashboard, or a results page to display key numbers that count up dynamically as visitors scroll. With built-in parallax depth and fully responsive layout options, it makes your data feel alive and premium on any screen.

What it does

Renders custom statistical cards that animate from zero using a customizable counting duration. The component automatically handles layout spacing, builds smooth scroll-driven parallax movements, and updates the display values instantly based on your items list. It perfectly organizes numbers, descriptive labels, and trends into neat, modern badges.

What you can customize

• Data settings: Control the number of cards to show, manage individual item content, adjust the counter duration, and tweak the parallax intensity.

• Colors & branding: Fully customize background colors for the container and individual cards, border accents, and text colors for numbers and labels. You can even style the trend badge background and badge text separately.

• Layout & typography: Tweak card border radius, adjust gap spacing between cards, choose your favorite font for the numbers, and scale the text size to fit your layout.

Great for

• Landing pages and hero sections

• Product launch and pricing tables

• Portfolio and agency case studies

• Dashboard previews and SaaS UI mocks

• Proof points and social proof blocks

Share your build

If you ship something cool with it, post it on X and tag me @Dulajweb , or send it over. I would love to see what you create.

Need help?

Questions or feedback? Reach me anytime: dulajdilshan766@gmail.com or on X @Dulajweb