Icon

Out of date

This documentation is out of date while we update the site. Until then, Culture Amp employees can refer to the visual documentation status page on the wiki.

An icon! To control its color, set color on a parent element, and it will be inherited.

Available for both Elm and React.

Warning

Code for this example

<Icon
  icon={importedSvgIcon}
  title="Warning"
/>

Interaction States

To signify an icon's Interaction States we use varying levels of opacity.

We have a helper class you can compose to utilize these styles:

.myButton {
composes: interactiveIconWrapper from 'cultureamp-style-guide/components/Icon/Icon.module.scss';
}

.myReversedButton {
composes: reversedInteractiveIconWrapper from 'cultureamp-style-guide/components/Icon/Icon.module.scss';
}