Briefle words · UI design
Badge
A small label attached to an item to show its status, category or a count, such as 'New' or a number of unread messages.
Say it to an AI
Three-up product grid with at most one badge per card, and only when it's worth acting on: a red discount badge for sale items, a quiet white 'New' badge for new arrivals, nothing otherwise. Keep the signal-to-noise ratio high so the product image and price stay the focus.
How an expert would brief the stronger version of “Product grid”.
See it
Try it as a puzzle →Sneaker category page in an online shoe store.
Why: A puts 9 colored flags across three cards (3 on each); B uses two.
More ways experts use it
Three-tier storage upgrade picker with the storage size as the hero number on each card. Make Plus the recommended plan: raised, accent border, a "Most popular" badge and the only filled button, so it reads as the default option. The other two stay available with outline buttons.
Storage plan picker · UI design
Related words
Room 2 · Hierarchy & emphasis
Learn “Badge” in a five-minute lesson