Iconfont图标怎么用？在 Pixso 插件广场找到并安装图标插件，打开设计文件后搜索所需图标，拖入导航栏，再统一尺寸、线宽、颜色和选中态。下面用电商 App 的“首页、购物车、收藏、我的”底部导航说明操作。
Iconfont图标怎么用：从插件到导航栏
Iconfont 适合在需要统一风格的导航栏、按钮和功能入口中使用。先确定图标语义，再检查网格尺寸、线宽和颜色状态。
电商 App 的底部导航需要让用户快速识别入口。先确定“首页、购物车、收藏、我的”四项，再为每项选择同一风格的图标，避免在一个导航栏中混用粗线条、细线条和立体图标。
步骤一：浏览器在线访问Pixso插件广场，进入插件库。
步骤二：在插件广场的搜索框输入 Iconfont，进入对应插件详情并安装到工作台。
步骤三：进入 Pixso 工作台并打开电商 App 设计文件，在插件菜单中找到 Iconfont 并运行。打开插件后，再搜索导航所需的图标。
打开插件后搜索“首页”，从结果中挑选与导航语义匹配的图标。先确认线性或面性风格，再检查图标在 24px 或 32px 网格中的视觉重量。
插件中可以先改颜色预览，再把图标拖入页面。四个图标使用相同的网格尺寸；线性图标对齐描边粗细和端点风格，面性图标检查缩小后是否仍能识别。选中态可采用强调色或填充变化，未选中态保持中性色，同时保留文字标签，不只靠颜色区分。
把四个图标与文字分别组合后，检查图标到文字的距离、导航项宽度和整体对齐。“首页”选中时，其他入口仍应清楚可辨。需要查看完整图标集时，可从插件提供的来源入口打开 Iconfont；交付前记录图标来源，并检查对应许可中的商用和署名要求。
更多图标插件：按风格和场景选择
除了 Iconfont，Pixso插件广场还有 3D、开源图标和多字重图标等资源。按项目的风格、输出格式和授权条件选择，不要只按插件数量判断是否适合。
3D icons
3D icons 适合需要立体物件或等距视图的页面。使用前先确认输出是可编辑图层还是图片，再按页面背景调整颜色和视角；复杂图标还要检查缩小后是否仍能识别。
IconPark
IconPark 是字节跳动开源的图标资源，插件中可按分类、规格和样式筛选。把图标用于产品页面前，回到项目的开源许可说明确认使用范围，并保持同一套视觉风格。
Phosphor Icons
Phosphor Icons 适合界面、图表和演示中的通用符号。插件支持搜索与字重筛选；确定使用前，仍需按 Phosphor Icons 的许可证和项目交付要求保留必要信息。
把选好的图标整理为导航组件
导航图标确定后，可把图标与文字组成可复用的导航组件，统一维护默认和选中状态。这样新增页面时能沿用相同的尺寸、间距与状态规则，减少逐页调整。
