Icons
@plaud/design ships no icon implementations. Every icon used by the components is injected
by the consumer through an IconRegistry. This page lists all icon keys you must provide and
shows how each one renders in the default reference set (plaudIconRegistry).
- For how to configure and inject the registry, see Icon Registry.
- Most icons are typed
ComponentType<IconProps>;sortadditionally acceptssortDirection. - The previews below use this site's
plaudIconRegistry(sourced from the Figma Design System). - Under each icon: the
IconRegistrykey and the components that use it (up to 3;—means no component currently uses it).
All icons
infoCircleToastcheckmarkCircleToastexclamationCircleToastxmarkCircleToastchevronUp—chevronRightDropdownMenu · Breadcrumb · CarouselchevronDownSelect · Accordion · MenuchevronLeftCarousel · Calendar · ImageViewercheckCheckbox · Select · DropdownMenuxmarkDialog · DatePicker · UploadsearchInputmoreHorizontalPagination · BreadcrumbsortTable · Calendar · TimePickerhelpTablecalendarDatePicker · RangePickereyeOpenInputeyeCloseInputlistChevronDownTree · Tabscountdown—plus—zoomOutImageViewerzoomInImageViewerdeleteImageViewerexportImageViewershrinkImageViewercloudUploadUploadretryUploaduploadSuccessUploaduploadFailUploadaskAiAiButtonaiFeedbackToastNotes
- The key shown under each icon is the exact
IconRegistryfield name — your registry must cover every one of them, or the build fails (satisfies IconRegistry) and the component throws at runtime. - Colors: most icons use
currentColorand inherit the surrounding text color;uploadSuccesscarries a fixed brand gradient. uploadFailis a monochromecurrentColorglyph; the error color (--Status-Destructive) is applied at the usage site (e.g.Upload), not baked into the icon.