Skip to content

PinIcon

const PinIcon: NamedExoticComponent<Omit<{ children: ReactNode; className?: string; color?: IconColor; decorative?: boolean; ref?: Ref<SVGSVGElement>; size?: IconSize; testId?: string; title?: string; }, "children">>

Defined in: src/components/Icons/PinIcon.tsx:28

Pin icon component for pinning items to keep them visible.

A push-pin silhouette commonly used to pin tabs, conversations, or list items so they stay in view. A filled visual variant could indicate the pinned state.

Example

// Basic usage
<PinIcon />
// With custom size and color
<PinIcon size="sm" color="accent" />
// In a pin/unpin toggle
<IconButton icon={<PinIcon />} label="Pin item" />