使用来自 Font Awesome、Lucide、SVG、外部 URL 或项目文件的图标来增强文档。
Icon example
<Icon icon="flag" size={32} />

​
内联图标

当在段落中使用时，图标会以内联方式呈现。 轻松获得你需要的文档。
Inline example
<Icon icon="flag" iconType="solid" /> 轻松获得你需要的文档。

​
属性

​
icon
string
required
要显示的图标。可选值：
  • Font Awesome 图标 的名称
  • Lucide 图标 的名称
  • 用花括号包裹的、与 JSX 兼容的 SVG 代码
  • 指向外部托管图标的 URL
  • 项目中图标文件的路径
对于自定义 SVG 图标：
  1. 使用 SVGR 转换器将 SVG 进行转换。
  2. 将转换后的 SVG 代码粘贴到 SVG 输入框中。
  3. 从 JSX 输出框复制完整的 <svg>...</svg> 元素。
  4. 将与 JSX 兼容的 SVG 代码用花括号包裹：icon={<svg ...> ... </svg>}。
  5. 按需调整 height 和 width。
​
iconType
string
Font Awesome 的图标样式。仅在使用 Font Awesome 图标时生效。可选值：regular、solid、light、thin、sharp-solid、duotone、brands。
​
color
string
图标颜色（十六进制颜色码，例如 #FF5733）。
​
size
number
图标尺寸（以像素为单位）。