App Gallery - Copy this React, Tailwind Component to your project

Create a responsive Bootstrap layout that displays a grid of software application cards. Each card should contain an application icon, name, and brief description. The layout should be similar to Adobe's product showcase, with the following features: A header section with toggle buttons for 'Desktop', 'Mobile', and 'Web', along with the number of apps in each category. A responsive grid of cards, with 3 columns on larger screens and fewer columns on smaller screens. Each card should have: A colored square icon with the application's abbreviation (e.g., 'Ps' for Photoshop) The application name in bold A short description of the application's purpose Use Bootstrap's card component for each application. Implement a consistent color scheme, with each application having its own brand color for the icon. Ensure the layout is responsive and looks good on desktop, tablet, and mobile devices. Use Bootstrap's grid system to create the responsive layout. Add appropriate padding and margins to ensure proper spacing between elements.