3 D Contact Manager - Copy this Html, Tailwind Component to your project

Design a fully functional and modern 3D contact management app focusing on the main screen, built using HTML. The UI should be visually appealing and interactive, incorporating 3D effects and smooth animations to enhance user experience. The main page should feature: 1. Search Bar Positioned at the top of the screen, with a smooth slide in animation from the top on page load. The search bar should have a 3D depth effect, appearing slightly raised above the background, allowing users to efficiently search through their contacts. 2. Contact Display Contact Cards: Present each contact in large, beautiful 3D cards designed with the following elements: Contact Image: A big, high resolution image prominently displayed at the center of each card. The image should have a slight zoom in hover effect, adding a dynamic feel. Contact Name and Phone Number: Displayed clearly below the image with a modern, readable font. The name should appear larger than the phone number to emphasize importance. Edit Button: Positioned at the top left corner of each card. This button should appear with a fade in animation when the user hovers over the card, indicating the ability to edit contact details. Star Button: Located at the top right corner of each card. When clicked to mark a contact as a favorite, it should have a spin animation and a 3D pop out effect. Animations for Cards: As the user scrolls down, contact cards should appear with a staggered fade in and slight zoom animation, creating a layered, 3D scrolling effect. 3. Floating Action Button (FAB) A plus button located at the bottom right corner of the screen, with a 3D raised effect that makes it look like it’s floating above other UI elements. The button should have a bounce animation on page load, drawing attention to its purpose for adding new contacts. Upon clicking, it should trigger a smooth, expanding pop up animation for adding a new contact. 4. UI Enhancements and Animations 3D Effect: All UI components should have a 3D effect, giving them a depth that enhances the tactile feel of the interface. Hover Effects: Subtle glow and shadow effects should be implemented on buttons and cards when hovered over, providing immediate visual feedback and enhancing interactivity. Smooth Transitions: Implement smooth transitions between different states, such as editing a contact or scrolling through the list. The transition animations should be fluid and responsive to maintain a modern and seamless experience. 5. Design Requirements Ensure the design is optimized for performance, providing a smooth user experience without lag. The contact cards should be large, easy to read, and interact with, enhancing usability and accessibility. Maintain a consistent, modern aesthetic throughout the app, focusing on clean lines, soft shadows, and vibrant colors to create a visually appealing interface. The app should be fully responsive, adapting seamlessly to various screen sizes. Additional Features Implement a loading animation with a 3D spinner while waiting for the contacts to load, keeping the user engaged. The UI should include subtle animations for feedback, such as a slight "shake" or "vibration" effect when an invalid action is attempted. Ensure the main screen of the contact app is functional, visually stunning, and easy to use, with modern 3D animations and UI elements that provide an engaging and delightful user experience.