腾讯云智能体开发平台 Icon 图标

这篇说说腾讯云图标组件,内置68个常用图标,支持通过name、size、color属性自定义配置,必填属性为name。 基础用法:通过name指定图标名称,size和color分别设置尺寸与颜色。 属性说明:name为必填string类型,size可选xs至3xl,color为CSS颜色值。

相关产品
腾讯云智能体开发平台 产品页,含版本规格、价格与购买入口。

一、组件功能

用于显示图标的组件,内置 68 个常用图标(见下图),支持尺寸、颜色等自定义配置。

二、基础用法

通过 name 指定图标名称,size 设置图标尺寸,color 设置图标颜色。

Template 示例:

<Icon name="check-circle" size="lg" color="#00A870" />

效果展示如下:

三、属性说明

属性名 类型 描述 默认值
name ★ string 图标名称 (见下方可用图标列表) –
color string 图标颜色 (CSS 颜色值) –
size "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" 图标尺寸 "md"

注意:★ 标记为必填属性。

四、通用图标

·agent – 智能体

·analytics – 分析

·atom – 原子

·batch – 批处理

·bolt – 闪电

·bug – 调试

·check – 勾选

·check-circle – 勾选圆圈

·check-circle-filled – 勾选圆圈(填充)

·close – 关闭

·compass – 指南针

·confetti – 彩纸

·cube – 立方体

·dot – 点

·dots-horizontal – 横向点

·dots-vertical – 纵向点

·empty-circle – 空圆圈

·external-link – 外部链接

·info – 信息

·lifesaver – 救生圈

·lightbulb – 灯泡

·play – 播放

·plus – 加号

·reload – 重载

·search – 搜索

·sparkle – 星光

·sparkle-double – 双星光

·star – 星星

·star-filled – 星星(填充)

五、方向图标

·chevron-down – 下箭头

·chevron-left – 左箭头

·chevron-right – 右箭头

·chevron-up – 上箭头

·chevron-up-down – 上下箭头

六、文档与内容

·book-clock – 书本时钟

·book-closed – 合上的书

·book-open – 打开的书

·calendar – 日历

·chart – 图表

·document – 文档

·images – 图片

·notebook – 笔记本

·notebook-pencil – 笔记本铅笔

·page-blank – 空白页

七、地图与位置

·globe – 地球

·map-pin – 地图标记

·maps – 地图

八、设备

·desktop – 桌面

·mobile – 移动设备

·phone – 电话

九、用户与身份

·name – 名称

·profile – 个人资料

·profile-card – 个人资料卡

·user – 用户

十、开发与代码

·keys – 密钥

·lab – 实验室

·settings-slider – 设置滑块

·square-code – 方形代码

·square-image – 方形图片

·square-text – 方形文本

十一、其他

·circle-question – 问号圆圈

·mail – 邮件

·suitcase – 公文包

·wreath – 花环

赞 (0)
上一篇 4天前
下一篇 4天前