StorybookHave ideas?
Examples
Loading
Code
React
| Name | Type | Default | Description |
|---|---|---|---|
ariaHidden | boolean | true | Describes the value of the aria-hidden attribute on the SVG. Defaulted to true with the assumption that most icons are decorative.
If the icon does not have any associated label text, set this to false and ensure a title is provided for improved accessibility. |
className | string | Additional CSS classes to be added to the svg element | |
childrenrequired | ReactNode | The elements that make up the SVG | |
description | string | Long-text description of any SVG. Use for complex icons, otherwise title prop will suffice. | |
id | string | A custom id attribute for the SVG | |
inversed | boolean | false | If true sets inverse fill color. |
titlerequired | string | The descriptive name for the SVG icon | |
viewBox | string | A string describing the viewbox of the SVG. It is recommended that the icon is centered and fill up the default viewport size. See this blog post for further explanation on viewBox and how to use it. |
Component maturity
For more information about how we tested and validated our work for each checklist item, read our component maturity documentation.