Social Card-Tooltip

Transform the "Contact" or "Link in Bio" section of your site with the 3D Social Card & Tooltip. This is more than just a button; it is a premium micro-interaction designed to boost user engagement and make your links stand out.

Upon hovering, the social icon seamlessly fragments into multiple 3D layers (stack effect), while a sleek profile card animates into view, displaying your photo, name, handle, and a custom bio.

Key Features

• Stunning 3D Hover Effect: Fluid animation built with Framer Motion. The icon tilts and separates into vibrant 3D layers for a tactile, modern feel.
• Rich Profile Tooltip: Go beyond a simple icon. Showcase your identity with dedicated space for a Profile Picture, Name, Username/Handle, and a short Biography.
• Ultimate Customization: You have total control. Edit the icon gradient, layer colors, card background, borders, text styles, and even the outer tooltip frame color.
• Animation Control: Fine-tune the experience by adjusting the Animation Duration and the Layer Spread to make the 3D effect subtle or bold.
• Responsive & Adaptive: Works perfectly across all layouts and screen sizes.

Supported Platforms (Icons Included)

Simply select the platform from the dropdown menu, and the icon updates automatically:

• Instagram
• X (Twitter)
• LinkedIn
• GitHub
• Discord
• WhatsApp
• Facebook
• TikTok
• Twitch
• Pinterest

Styling Options

• Theme Colors: Define primary and secondary colors to create unique gradients for the 3D icon layers.
• Card Styling: deeply customize the card's look, including the Outer Frame Color, Inner Background, Border Color, and Border Width.
• Typography: Independent color controls for Name, Handle, and Description text to ensure perfect readability on any background.

How to Use

1. Drag the component onto your canvas.
2. Select your desired Platform from the properties panel.
3. Fill in your profile details (Link, Name, Bio, Image).
4. Tweak the colors to match your brand identity.
5. (Optional) Adjust the "Layer Spread" slider to customize the depth of the 3D effect.

Perfect for portfolios, landing pages, footers, "Meet the Team" sections, and social bio pages.

Due to the nature of digital products, all sales are final and non-refundable. If you experience any issues with the files, please contact me at ssktpp015@gmai.com, and i will be happy to assist you.