# Floating Consult Button

> The FloatingConsultButton is a sophisticated React component that creates a fixed, attention-grabbing circular button with continuously rotating text around a central image, perfect for driving user engagement on consulting, agency, or SaaS websites. When clicked, it reveals an elegant popup modal with a blurred backdrop that presents consultation details and a call-to-action button. Built with Framer Motion for smooth animations and fully customizable through props, you can easily adjust the button size, image, rotating text content and speed, popup messaging, CTA functionality, and positioning to match your brand. The component is responsive, scaling appropriately for mobile devices, and includes thoughtful touches like hover effects, smooth transitions, and an intuitive close mechanism, making it an ideal solution for businesses offering free consultations, product demos, or booking services.

- Author: [Muneeb ul Hassan](https://21st.dev/@muneebable)
- Library: Muneeb ul Hassan
- License: unknown
- npm dependencies: framer-motion
- Live preview: https://21st.dev/@muneebable/components/floating-consult-button

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/muneebable/floating-consult-button?api_key=$API_KEY_21ST"
```

Requires a 21st API key (generate one at https://21st.dev/mcp) passed as `API_KEY_21ST`. Free accounts get a limited number of installs per day; unlimited on a paid plan — see https://21st.dev/pricing.

Full component directory: https://21st.dev/llms.txt