StyledOcticon renders an Octicon with common system props, including color, margin, and padding.
Default example
<StyledOcticon icon={CheckIcon} size={32} color="icon.success" mr={2} />
<StyledOcticon icon={XIcon} size={32} color="icon.danger" />
System props
StyledOcticon components get COMMON system props. Read our System Props doc page for a full list of available props.
Component props
StyledOcticon passes all of its props except the common system props down to the Octicon component, including:
| Name | Type | Default | Description |
|---|
| ariaLabel | String | | Specifies the aria-label attribute, which is read verbatim by screen readers |
| icon | Component | | Octicon component used in the component |
| size | Number | 16 | Sets the uniform width and height of the SVG element |
| verticalAlign | String | text-bottom | Sets the vertical-align CSS property |