Instructions

• Your task is to create a reusable Badge UI Component that displays various statuses like Primary, Success, Error, Warning, and Neutral.
• The badge should support three sizes: small, medium, and large.
• Each badge should have a different color for its state (Primary, Success, etc.), as seen in the provided design.
• The component should work well on both light and dark backgrounds.

Hints

• Use padding and font-size to differentiate between the three sizes.
• Make sure the colors and fonts for each status are consistent with the design provided.
• Keep the structure simple and avoid unnecessary wrappers. Style directly through classes.

Bonus

• Add hover and active states for the badges.
• Add functionality to close (hide) the badges.