Block
Hero Floating
A hero block with floating badges and cards that animate gently in place.
Hero block
Keep momentum with floating highlights
Animated badges and cards help reinforce your message and create a premium first impression without heavy visuals.
Update
Weekly drop
New components ready to install.
Signal
98 percent satisfaction
Teams ship faster with curated blocks.
Badge
Launch ready
Crafted for product teams.
Dependencies
- framer-motion
Files
- components/blocks/hero-floating.tsx
Installation
Using shadcn CLI
npx shadcn add hero-floating --url https://ui.hampton.ioManual installation
Copy the component file to your project and install dependencies:
npm install framer-motion