CategoryBadge

Small colored pill for a news item's category, derived from the accent token via color-mix (no dedicated per-category palette).

News

Usage

import { CategoryBadge } from "@zudo-sg/ui";

<CategoryBadge category="IR" />

All categories

Unknown category (neutral fallback)

Source

<CategoryBadge category="Corporate" />
<CategoryBadge category="Products" />
<CategoryBadge category="Sustainability" />
<CategoryBadge category="Exhibitions" />
<CategoryBadge category="IR" />

Live CSS

Injected into the previews above. CategoryBadge

/* Live CSS — edits inject into every preview above.
   Try overriding a component utility, e.g.:
   .btn { letter-spacing: 0.04em; } */