Sidebar Navigation with Active State Indicator

This is a responsive vertical sidebar navigation component built with Tailwind CSS. It has a list of navigation links styled to indicate the active page. The links have hover states to change background color and text color on hover. Some links contain badge indicators showing a count. The badges are rounded with a border and centered text. The sidebar uses Flexbox with flex-col to stack the links vertically. The links are styled with p-2 for padding, rounded-md for border radius, text-sm for font size, font-semibold for weight. The active link has bg-gray-50 background and text-indigo-600 text color. Default links are text-gray-700 with hover bg-gray-50 and hover text-indigo-600.

Similar Components

Other components related to sidebar, navigation, vertical nav, flexbox, badges, indicators, hover states tags