Icon Component

An icon component is an SVG component that:

And it's one way of rendering an icon.

Example / Usage

markdown
A right arrow circle <Icon src="arrow-right-circle.svg" size="20"/>

Output:

A right arrow circle

Props

All standard SVG attributes can be applied as props. See the list of SVG Presentation Attributes on MDN.

Markdown Support

This component is registered as Markdown component and can be used in a markdown page

Why another styling?

By default, styling systems set the svg as being a block image and not as a character. The icon component makes it a character.

Example with preflight