Rich Icons Library

All rich icons in the Workleap icon library are available in three predefined sizes. To ensure consistency and clarity, always use the icons at one of these sizes. Avoid resizing icons to dimensions other than the provided options.

To integrate a rich icon into your project, simply import it from @hopper-ui/icons.

import { ActionListRichIcon } from "@hopper-ui/icons"

The color of the rich icons can be changed by using the variant prop. The following decorative colors are available as variants: option1 to option8. The following status colors are available as well: success, warning, danger, information and upsell.

<ActionListRichIcon variant="option3" />

You can preview rich icons in your preferred size. Simply click on an icon to instantly copy its name!