Featured Icon
Icon in a highlighted container. The shared atom behind Alert, Notification, Modal, Empty state, Slideout and File upload headers.
import
{ FeaturedIcon } from "@pepulux/ui"Variant: Modern
Outlined gray box (default). Use className to change the size or radius.
Variant: Ring
Pulse halo used by Alert and Notification.
Variant: Circle
Light filled circle with a soft ring, used by Modal headers.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| icon* | ReactNode | — | Icon node, usually a 16–20px lucide icon |
| variant | "modern" | "ring" | "circle" | "modern" | Container style |
| color | "gray" | "brand" | "success" | "warning" | "error" | "gray" | Icon and halo colour |
| className | string | — | Override size, radius or spacing |