chenzy-design

图标列表

@chenzy-design/icons（523 个：面性/线性 + AI 单/双/多色）与 @chenzy-design/icons-lab（84 个彩色）全量列表，点击复制图标名。

@chenzy-design/icons 523 @chenzy-design/icons-lab 84

import { Icon } from '@chenzy-design/svelte';

从 @chenzy-design/icons 引入具名图标组件，用法同 Semi：<IconHome />。

具名图标自带 size 尺寸、rotate 静态旋转、spin 持续旋转（受 reduced-motion 抑制）。

Icon 封装 size 属性：extra-small(8) / small(12) / default(16) / large(20) / extra-large(24)，也可用 inherit 继承上下文字号。

单色图标自动继承外部容器 CSS color；也可通过 style 修改图标颜色。

双色 AI 图标（IconAI*Level2）通过 fill 属性设置颜色，支持 string 与 string[]。

多色 AI 图标（IconAI*Level3）四色渐变，缺省用默认多彩色，也可通过 fill 传 string[] 自定义。

通过 <Icon> 容器把外部 svg 纳入统一尺寸/颜色/旋转/a11y 体系；提供 type 后 role=img + aria-label；fill 覆盖填充色。

<Icon> 容器 + slot 自定义 svg，支持五档枚举尺寸（font-size 驱动：8/12/16/20/24），把外部图标纳入统一体系。

单色具名图标继承外层 color，用 style 应用预设语义色；spin 属性使图标持续旋转，受 reduced-motion 抑制。

不经过 Icon 组件，直接用 UnoCSS preset-icons 的 i-lucide-* class。图标数据来自本地 @iconify-json/lucide，颜色/尺寸走工具类。

属性	说明	类型	默认值
`svg`	SVG 字符串（{@html} 渲染，来源须可信）或自定义图标 Snippet（对齐 Semi svg）	`string \| Snippet`	undefined
`size`	font-size 驱动尺寸：extra-small(8)/small(12)/default(16)/large(20)/extra-large(24)；inherit 继承上下文字号	`'inherit'\|'extra-small'\|'small'\|'default'\|'large'\|'extra-large'`	'default'
`spin`	持续旋转，受 reduced-motion 抑制	`boolean`	false
`rotate`	静态旋转角度（deg）；仅安全整数生效	`number`	undefined
`type`	图标语义类型，映射到 aria-label 与 cd-icon-{type} 类（对齐 Semi）	`string`	undefined
`fill`	覆盖填充色（对齐 Semi fill；用于双色/多色图标改色）	`string`	undefined
`class`	—	`string`	''
`style`	透传到根元素的内联样式	`string`	''

名称	说明
`children`	自定义图标内容（svg 未传时的备选插槽）