Primer

Icon

Use the icon component to display Octicons with an optional background
import {Icon} from '@primer/react-brand'

Examples

Default

Colors

With background

Sizes

Component props

Icon

NameTypeDefaultDescription
iconOcticonProps | React.ReactElement<OcticonProps>The Octicon component to render
color'default', 'blue', 'coral', 'green', 'gray', 'indigo', 'lemon', 'lime', 'orange', 'pink', 'purple', 'red', 'teal', 'yellow''default'The color of the icon
size'small', 'medium', 'large', 20, 24, 28, 32, 36, 40, 44'small'The size of the icon
hasBackgroundbooleanfalseWhether to show a background behind the icon
classNamestringAdditional CSS class for the icon

All other props are forwarded to the underlying SVG element.