akey-icons

发布更新参考

https://akeychat.feishu.cn/wiki/DCCRwGaTriVlZAk8rjQcscCwnje

Icon

语义化的矢量图形。使用图标组件，你需要安装 @akey/icons 图标组件包：

npm install --save @akey/icons

图标列表

图标文本

代码演示

基本使用

关于 SVG 图标

我们使用了 SVG 图标，有以下优势：

• 完全离线化使用，不需要从 CDN 下载字体文件，图标不会因为网络问题呈现方块，也无需字体文件本地部署。
• 在低端设备上 SVG 有更好的清晰度。
• 支持多色图标。
• 对于内建图标的更换可以提供更多 API，而不需要进行样式覆盖。

所有的图标都会以 <svg> 标签渲染，可以使用 style 和 className 设置图标的大小和单色图标的颜色。例如：

import React from 'react';
import { Me } from '@akey/icons';

<Me style={{ fontSize: '16px', color: '#08c' }} />;

注：其中多色图标已经内置 fill 颜色，不能另做修改。

<style> .icons-list { display: flex; flex-wrap: wrap; } .icons-item { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 16.6%; margin: 12px 0; cursor: pointer; } .icon-demo { font-size: 40px; } </style>