Icon example
Custom image icons
Use thesrc prop to display a custom image as an icon. The image can be a file in your project or an externally hosted URL.
Custom image examples
Inline icons
Icons appear inline when used within a sentence, paragraph, or heading. Use icons for decoration or to add visual emphasis.Inline example
Properties
You must include one of
icon or src.The icon to display from an icon library.Options:
- Font Awesome icon name, if you have the
icons.libraryproperty set tofontawesomein yourdocs.json - Lucide icon name, if you have the
icons.libraryproperty set tolucidein yourdocs.json - Tabler icon name, if you have the
icons.libraryproperty set totablerin yourdocs.json
Path or URL to an image to use as the icon. Use
src instead of icon when you want to use a custom image rather than an icon from a library.Options:- Path to an image file in your project (for example,
/images/my-icon.svg) - URL to an externally hosted image (for example,
https://example.com/icon.png)
The Font Awesome icon style. Only used with Font Awesome icons.Options:
regular, solid, light, thin, sharp-solid, duotone, brands.The color of the icon as a hex code (for example,
#FF5733).The size of the icon in pixels.
Custom CSS class name to apply to the icon.