# Icon 图标
这里主要根据 font-awesome (opens new window) 提供的丰富图标集合
# 基本图标
设置图标类名，例如：eye phone wifi trash thumbs-up 等
点击查看代码
<nb-icon type="eye"></nb-icon>
<nb-icon type="phone"></nb-icon>
<nb-icon type="wifi"></nb-icon>
<nb-icon type="trash"></nb-icon>
<nb-icon type="thumbs-up"></nb-icon>
<nb-icon type="link"></nb-icon>
<nb-icon type="save"></nb-icon>
<nb-icon type="undo"></nb-icon>
<nb-icon type="car"></nb-icon>
<nb-icon type="bug"></nb-icon>
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
# 动画图标
设置 spin
点击查看代码
<nb-icon spin type="circle-o-notch"></nb-icon>
<nb-icon spin type="refresh"></nb-icon>
<nb-icon spin type="cog"></nb-icon>
<nb-icon spin type="spinner"></nb-icon>
1
2
3
4
2
3
4
# 颜色图标
设置 color，支持 十六进制颜色、rgb、颜色名
点击查看代码
<nb-icon color="green" type="check"></nb-icon>
<nb-icon color="red" type="close"></nb-icon>
<nb-icon color="#b81d25" type="battery-quarter"></nb-icon>
<nb-icon color="#2aa515" type="battery-4"></nb-icon>
<nb-icon color="rgba(0,0,255)" type="bluetooth"></nb-icon>
1
2
3
4
5
2
3
4
5
# 图标集合
user-o
user-circle-o
cog
telegram
spinner
circle-o-notch
file
warning
bar-chart
jpy
arrow-right
arrow-left
arrow-up
arrow-down
arrows
chevron-right
chevron-left
chevron-up
chevron-down
hand-o-up
pause
backward
forward
play
stop
child
comments
check-square
commenting-o
cloud-upload
coffee
cubeward
diamond
envelope-o
exclamation
frown-o
gift
heartbeat
laptop
info-circleop
microphone
mobile-phone
music
magic
plus-circle
remove
send
star-o
tags
taxi
# Attributes
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| type | 图标类名 | string | eye/phone/wifi 等，更多font-awesome (opens new window) | — |
| size | 图标大小 | number | 默认以 px 为单位 | 20（px） |
| color | 图标颜色 | string | 十六进制 / rgba / 颜色名 | #2c3e50 |
| spin | 图标是否旋转 | boolean | —— | false |