A
Anonymous

Rich Navigation Sidebar - Copy this Html, Tailwind Component to your project

Create a navigation bar using HTML and Tailwind CSS with the following specifications: The navigation bar should be on the left side and have a black background with 60% opacity. Include four buttons with icons and labels: "About Us", "Our Members", "Our Journey", and "Our Music". Use Font Awesome icons for each button: "About Us": fa info circle "Our Members": fa users "Our Journey": fa road "Our Music": fa music The icons should be 2rem in size, and the text should be 1.25rem. When the user hovers over each button: The background should change to a translucent white (rgba(255, 255, 255, 0.2)). The button should slightly scale up (e.g., 1.05 times its original size) with a smooth transition. Add a subtle hover animation with a 0.3s ease in out transition.

Prompt
Component Preview

About

Rich Navigation Sidebar - Stylish left-aligned menu with black 60% opacity, Font Awesome icons, hover effects, and smooth transitions.. Download instantly!

Share

Last updated 1 month ago