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

Design a fully functional, modern 3D contact management app using HTML, incorporating interactive animations to enhance user experience. The main page should feature a clean, optimized layout with the following elements: 1. Header and Search Bar: Search Bar: Positioned at the top of the screen, with a smooth slide down animation on page load. This bar should allow users to quickly search through their contacts. 2. Contact Display: Contact Cards: Display each contact using large, beautiful 3D cards that feature: Contact Image: A big, high resolution image prominently displayed with a slight zoom in hover effect. Contact Name and Phone Number: Clearly displayed with a modern font, with the name appearing larger for emphasis. Edit Button: Located at the top left corner of each card, appearing with a fade in animation when hovering over the card. Star Button: Positioned at the top right corner of each card, featuring a spin animation when clicked to mark contacts as favorites. Animation: Cards should enter with a staggered fade in and slight zoom animation as the user scrolls through the contact list. 3. Floating Action Button (FAB): Add New Contact Button: A plus button located at the bottom right corner with a bounce animation on page load to catch the user's attention. Clicking this button should open a new contact form with a smooth pop up animation. 4. Bottom Navigation Bar: A modern, 3D bottom navigation bar with three primary buttons, each with interactive animations: Contacts Button: Represents the main contact list view. When hovered or clicked, the icon slightly enlarges with a pop animation. Dial Pad Button: Opens a dial pad screen for making direct calls. On interaction, the icon should perform a quick spin animation. Settings Button: Navigates to the settings page, featuring a shake animation on hover to suggest interaction. 5. Dial Pad Screen: A clean and minimalist design for the dial pad, with large, easy to tap 3D buttons. Each number key should have a subtle press down animation when tapped. 6. Settings Page: The settings page should maintain a sleek, modern aesthetic with toggle switches and sliders. Include animations like a slide in transition for toggles and smooth color changes for sliders when adjusted. 7. Page Transitions: Implement smooth slide left and slide right animations when navigating between Contacts, Dial Pad, and Settings pages. Fade in and fade out animations for modals, such as the edit contact form or adding new contacts. 8. Design Requirements: All components should have a 3D effect with a professional, modern look. Ensure optimal performance for smooth, lag free user interaction. The contact cards should be large and interactive to enhance usability. The app should be fully responsive, adapting seamlessly to different screen sizes. Additional Enhancements: Include a subtle glow effect around active buttons to indicate current selection or interaction. A 3D loading spinner animation should be included for data loading states to keep users engaged while waiting. Ensure the app is fully functional, beautiful, and user friendly with modern animations and transitions that enhance the user experience. The design should be cohesive and consistent, providing a delightful and engaging interaction for all users.