图标

使用主流图标库中的图标

从 Font Awesome、Lucide、SVG、外部 URL 或项目文件中添加图标，以增强文档。

图标示例

<Icon icon="flag" size={32} />

​

行内图标

在段落中使用时，图标会以内联方式放置。

你想要的文档，轻松获得。

内联图标示例

<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

图标的大小（以像素为单位）。