Evergreen uses the amazing @blueprintjs/icons package for all of its icons.
All of Evergreen's icons are exported as individual components, and can be imported directly like so:
import { CrossIcon } from 'evergreen-ui'
import { InfoSignIcon, EditIcon } from 'evergreen-ui'
A icon is only a svg element and should not have onClick handlers.
If you need a clickable icon, use IconButton instead.
Use the color prop on a Icon component to change the color.
There are a couple of presets available: default, muted, disabled, selected, success, info, danger, warning.
There is an exported Icon component which acts as a convenient wrapper around icons so you can dynamically pass icons to it:
Each icon has two different svg variations, a 16px and 20px variation.
Evergreen will choose the most appropriate size based on the size passed to the icon.