Zay UI

Appearance

Icon 图标组件 ​

图标组件是采用 iconfont css 方式实现， 因此你需要引入 css 文件和 js 文件，才能正常使用图标组件。

安装 Icon ​

bash
npm install zay-icon

使用 Icon ​

js
import Vue from 'vue';
import ZayIcon from 'zay-icon';
// 引入样式文件
import 'zay-icon/dist/index.css';
Vue.use(ZayIcon);

示例 ​

html
<z-icon name="search" />

图标列表 ​

deleteteam
layout-fill
expend
deleteuser
appstore-fill
folder-view
addteam
mobile-fill
file-GIF
user
tablet-fill
group
team
book-fill
send
areachart
redenvelope-fill
Report
linechart
safetycertificate-f
View
barchart
propertysafety-fill
shortcut
pointmap
insurance-fill
ungroup
container
securityscan-fill
database
file-exclamation-fil
sever
file-add-fill
mobile
file-fill
tablet
file-excel-fill
redenvelope
file-markdown-fill
book
file-text-fill
filedone
file-ppt-fill
reconciliation
file-unknown-fill
file-exception
file-word-fill
filesync
file-zip-fill
filesearch
file-pdf-fill
solution
file-image-fill
fileprotect
diff-fill
file-add
file-copy-fill
file-excel
snippets-fill
file-exclamation
batchfolding-fill
file-pdf
reconciliation-fill
file-image
folder-add-fill
file-markdown
folder-fill
file-unknown
folder-open-fill
file-ppt
database-fill
file-word
container-fill
file
sever-fill
file-zip
calendar-check-fill
file-text
image-fill
file-copy
idcard-fill
snippets
creditcard-fill
audit
fund-fill
diff
read-fill
Batchfolding
contacts-fill
securityscan
delete-fill
propertysafety
notification-fill
safetycertificate
flag-fill
insurance
moneycollect-fill
alert
medicinebox-fill
delete
rest-fill
hourglass
shopping-fill
bulb
skin-fill
experiment
video-fill
bell
sound-fill
trophy
bulb-fill
rest
bell-fill
USB
filter-fill
skin
fire-fill
home
funnelplot-fill
bank
gift-fill
filter
hourglass-fill
funnelplot
home-fill
like
trophy-fill
unlike
location-fill
unlock
cloud-fill
lock
customerservice-fill
customerservice
experiment-fill
flag
eye-fill
moneycollect
like-fill
medicinebox
lock-fill
shop
unlike-fill
rocket
star-fill
shopping
unlock-fill
folder
alert-fill
folder-open
api-fill
folder-add
highlight-fill
deploymentunit
phone-fill
accountbook
edit-fill
contacts
pushpin-fill
carryout
rocket-fill
calendar-check
thunderbolt-fill
calendar
tag-fill
scan
wrench-fill
select
tags-fill
boxplot
bank-fill
build
camera-fill
sliders
error-fill
laptop
crown-fill
barcode
mail-fill
camera
car-fill
cluster
printer-fill
gateway
shop-fill
car
setting-fill
printer
USB-fill
read
golden-fill
cloud-server
build-fill
cloud-upload
boxplot-fill
cloud
sliders-fill
cloud-download
alibaba
cloud-sync
antdesign
video
ant-cloud
notification
behance
sound
googleplus
radarchart
medium
qrcode
google
fund
IE
image
amazon
mail
slack
table
alipay
idcard
taobao
creditcard
zhihu
heart
HTML
block
linkedin
error
yahoo
star
facebook
gold
skype
heatmap
CodeSandbox
wifi
chrome
attachment
codepen
edit
aliwangwang
key
apple
api
android
disconnect
sketch
highlight
Gitlab
monitor
dribbble
link
instagram
man
reddit
percentage
windows
pushpin
yuque
phone
Youtube
shake
Gitlab-fill
tag
dropbox
wrench
dingtalk
tags
android-fill
scissor
apple-fill
mr
HTML-fill
share
windows-fill
branches
QQ
fork
twitter
shrink
skype-fill
arrawsalt
weibo
verticalright
yuque-fill
verticalleft
Youtube-fill
right
yahoo-fill
left
wechat-fill
up
chrome-fill
down
alipay-circle-fill
fullscreen
aliwangwang-fill
fullscreen-exit
behance-circle-fill
doubleleft
amazon-circle-fill
doubleright
codepen-circle-fill
arrowright
CodeSandbox-circle-f
arrowup
dropbox-circle-fill
arrowleft
github-fill
arrowdown
dribbble-circle-fill
upload
googleplus-circle-f
colum-height
medium-circle-fill
vertical-align-botto
QQ-circle-fill
vertical-align-middl
IE-circle-fill
totop
google-circle-fill
vertical-align-top
dingtalk-circle-fill
download
sketch-circle-fill
sort-descending
slack-circle-fill
sort-ascending
twitter-circle-fill
fall
taobao-circle-fill
swap
weibo-circle-fill
stock
zhihu-circle-fill
rise
reddit-circle-fill
indent
alipay-square-fill
outdent
dingtalk-square-fill
menu
CodeSandbox-square-f
unorderedlist
behance-square-fill
orderedlist
amazon-square-fill
align-right
codepen-square-fill
align-center
dribbble-square-fill
align-left
dropbox-square-fill
pic-center
facebook-fill
pic-right
googleplus-square-f
pic-left
google-square-fill
bold
instagram-fill
font-colors
IE-square-fill
exclaimination
medium-square-fill
check-circle
font-size
linkedin-fill
CI
infomation
QQ-square-fill
Dollar
line-height
reddit-square-fill
compass
strikethrough
twitter-square-fill
close-circle
underline
sketch-square-fill
frown
number
slack-square-fill
info-circle
italic
taobao-square-fill
left-circle
code
weibo-square-fill
down-circle
column-width
zhihu-square-fill
EURO
check
zoomout
copyright
ellipsis
apartment
minus-circle
dash
audio
meh
close
audio-fill
plus-circle
enter
robot
play-circle
line
zoomin
question-circle
minus
robot-fill
Pound
question
bug-fill
right-circle
rollback
bug
smile
small-dash
audiostatic
trademark
pause
comment
time-circle
bg-colors
signal-fill
timeout
crown
verified
earth
drag
shortcut-fill
YUAN
desktop
videocameraadd
up-circle
gift
switchuser
warning-circle
stop
whatsapp
sync
fire
appstoreadd
transaction
thunderbolt
caret-down
undo
check-circle-fill
backward
redo
left-circle-fill
caret-up
reload
down-circle-fill
caret-right
reloadtime
minus-circle-fill
caret-left
message
close-circle-fill
fast-backward
dashboard
info-circle-fill
forward
issuesclose
up-circle-fill
fast-forward
poweroff
right-circle-fill
search
logout
plus-circle-fill
retweet
piechart
question-circle-fill
login
setting
EURO-circle-fill
step-backward
eye
frown-fill
step-forward
location
copyright-circle-fil
swap-right
edit-square
CI-circle-fill
swap-left
export
compass-fill
woman
save
Dollar-circle-fill
plus
Import
poweroff-circle-fill
eyeclose-fill
appstore
meh-fill
eye-close
close-square
play-circle-fill
clear
down-square
Pound-circle-fill
collapse
layout
smile-fill
expand
left-square
stop-fill
deletecolumn
play-square
warning-circle-fill
merge-cells
control
time-circle-fill
subnode
codelibrary
trademark-circle-fil
rotate-left
detail
YUAN-circle-fill
rotate-right
minus-square
heart-fill
insertrowbelow
plus-square
piechart-circle-fil
insertrowabove
right-square
dashboard-fill
table1
project
message-fill
solit-cells
wallet
check-square-fill
formatpainter
up-square
down-square-fill
insertrowright
calculator
minus-square-fill
formatpainter-fill
interation
close-square-fill
insertrowleft
check-square
codelibrary-fill
translate
border
left-square-fill
deleterow
border-outer
play-square-fill
sisternode
border-top
up-square-fill
Field-number
border-bottom
right-square-fill
Field-String
border-left
plus-square-fill
Function
border-right
accountbook-fill
Field-time
border-inner
carryout-fill
GIF
border-verticle
calendar-fill
Partition
border-horizontal
calculator-fill
index
radius-bottomleft
interation-fill
Storedprocedure
radius-bottomright
project-fill
Field-Binary
radius-upleft
detail-fill
Console-SQL
radius-upright
save-fill
icon-test
radius-setting
wallet-fill
aim
adduser
control-fill
compress

API ​

Props ​

| 参数 | 说明

Released under the MIT License.

Copyright © 2024-present Irming