I'll create a React component for a WhatsApp floating button using Tailwind CSS. This button will be fixed to the bottom-right corner of the screen and will link to a WhatsApp chat when clicked.

This code creates a WhatsApp floating button with the following features:

1. The button is fixed to the bottom-right corner of the screen.
2. It uses a green background color, which is associated with WhatsApp.
3. The button displays the WhatsApp icon from the Lucide React library.
4. When clicked, it opens a new tab with a pre-filled WhatsApp chat.
5. The button has a hover effect that slightly darkens the green color.
6. It's fully responsive and will look good on both desktop and mobile devices.

To use this component, you need to:

1. Install the Lucide React library if you haven't already:

   npm install lucide-react
2. Make sure you have Tailwind CSS set up in your project.
3. Use the WhatsAppButton component in your pages, passing the required phoneNumber prop and an optional message prop.

The phoneNumber should be in international format without any special characters (e.g., "1234567890" for a US number). The message prop is optional and will be pre-filled in the WhatsApp chat when the user clicks the button.

This implementation provides a non-intrusive way for visitors to quickly initiate a WhatsApp chat with you or your business directly from your website.

I apologize for the confusion. Let's create a more WhatsApp-like chat button that emphasizes messaging rather than calling. We'll use the WhatsApp brand color and a chat icon to make it more recognizable.

This updated version of the WhatsApp button has the following improvements:

1. Uses the official WhatsApp green color (#25D366) for the button background.
2. Uses a chat icon (MessageCircle) instead of a phone icon to emphasize messaging.
3. Adds a small red notification badge to attract attention.
4. Includes a tooltip that appears on hover, inviting users to chat.
5. Has a subtle scale animation on hover for better interactivity.
6. Uses the darker WhatsApp green color (#128C7E) on hover for a nice effect.

The button is still fixed to the bottom-right corner of the screen and opens a new WhatsApp chat when clicked.

To use this component:

1. Make sure you have Lucide React installed:

   npm install lucide-react
2. Ensure Tailwind CSS is set up in your project.
3. Use the WhatsAppButton component in your pages, passing the required phoneNumber prop and an optional message prop.

This implementation provides a more WhatsApp-like chat button that's instantly recognizable and encourages users to start a conversation. The notification badge and hover tooltip add extra elements to draw attention and explain the button's purpose.