Sui Ecosystem - Copy this React, Tailwind Component to your project

1. Page Title: “Sui Ecosystem” • Add a large header section for the ecosystem name. • Include an icon/logo for the ecosystem on the left (provide the Sui logo or placeholder). • Display the following details next to the title: • Market Cap: “$157.05B” • Projects Count: “76” • Ecosystem Backers: Add icons representing backers (example: Binance, CEX, etc.). 2. Overview Section: • Add a short description of the ecosystem below the title: “Sui is a decentralized permissionless smart contract platform based towards low latency management of assets.” • Include a “Read more” link for expanded details. 3. Navigation Links: • Display a row of icons with links to ecosystem explorers, website, social media (Discord, Twitter), and additional links. 4. Projects Section: • Add a “Projects” title and a search/filter bar for searching and filtering dapps. • Provide filter categories above the projects: • Stablecoin (4) • Developer Tools (4) • Exchange Aggregator (3) • NFT (3) • RWA (2) • Options (1) • Yield Aggregator (1) • Each category should have a clickable button that updates the project listings based on the filter. 5. Dapps Display (DEX): • Create a section for “DEX” with a right facing arrow button for expanding the section. • Showcase dapps in grid style cards. • Each Dapp Card includes: • Icon/Logo of the dapp (e.g., Cetus Protocol, RocketX Exchange, Turbos Finance, etc.). • Dapp Name and Short Description. • Dapp Type Tags: e.g., DEX, AMM, Bridge. • Clickable Icons for the Dapp website, explorer, and game link (if applicable). 6. Footer: • At the bottom of the list, include a “View All” button to allow users to browse all the projects. Styling & Layout: • Dark Theme: Background should be dark (similar to the one in the image), with white or light colored text. • Card Design: Slightly rounded corners for project cards, each with a subtle shadow. • Font: Use a modern sans serif font for text (similar to what’s visible in the image). • Icons: Ensure there is space for clickable icons like a globe for a website link, a chain link for blockchain explorer, and a gaming controller for game access. You can feed this prompt into an AI design tool or automation tool that supports design tasks based on structured text input. Let me know if you need any adjustments!