Turn any Framer page into a direct WhatsApp touchpoint. WhatsApp Quick Chat sits as a floating button — minimal by default, powerful on interaction.
Expand on hover — A smooth spring animation opens an inline input bubble. No popups, no modals, no page jumps.
Two input modes — Use a placeholder for freeform messages, or set a custom pre-filled text so visitors send exactly what you want them to.
Animated icon swap — The WhatsApp logo rotates and crossfades into a send arrow when the bubble is open, making the interaction self-explanatory.
Smart collapse — The bubble stays open while the user is typing. It only collapses when the field is empty or unchanged, so messages are never lost by accident.
Keyboard ready — Enter sends, Escape dismisses and resets. Works as expected.
Clean deep link — Opens wa.me in a new tab with the message pre-filled. Phone number formatting is handled automatically.
1. Drop the component on your Framer canvas.
2. Set your phone number with country code (e.g. 5511999999999).
3. Pick an input style: Placeholder or Custom Message.
4. Style the button and bubble from the property panel — colors, icons, shadows, borders.
5. Pin it as a fixed element and publish.
